From 5a0040a577f97da3cd305fc23f4b815c524760ff Mon Sep 17 00:00:00 2001 From: feerglas Date: Mon, 24 Aug 2020 11:40:33 +0200 Subject: [PATCH] fix: add linter, fix linting styles --- .eslintignore | 3 + .eslintrc.js | 320 ++++++++++++++++++++++++++++++- build.js | 13 +- ci/gitPushProperties.js | 28 ++- commitlint.config.js | 63 ++++-- config.js | 271 +++++++++++++++----------- figmaExtractor/figmaApi.js | 4 +- figmaExtractor/figmaExtractor.js | 19 +- figmaExtractor/figmaFrames.js | 18 +- figmaExtractor/figmaJson.js | 37 ++-- figmaExtractor/figmaWriteJson.js | 7 +- package.json | 3 +- sketch/ColorPage.js | 2 + sketch/Swatch.js | 2 + sketch/colorGroup.js | 2 + sketch/index.js | 2 + 16 files changed, 615 insertions(+), 179 deletions(-) diff --git a/.eslintignore b/.eslintignore index eeefc4a3..7fb055d0 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,2 +1,5 @@ +.eslintrc.js +dist/**/* + # not ignored folders/files !.travis.yml diff --git a/.eslintrc.js b/.eslintrc.js index 439fa920..d1518b8f 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -7,7 +7,325 @@ module.exports = { ecmaVersion: 2018, sourceType: 'module' }, + globals: { + 'require': 'readonly', + 'module': 'readonly', + 'process': 'readonly', + '__dirname': 'readonly' + }, plugins: [ 'yaml' - ] + ], + rules: { + // #################################################### + // Possible errors + // #################################################### + 'no-mixed-spaces-and-tabs': 'error', + 'for-direction': 'error', + 'getter-return': 'error', + 'no-async-promise-executor': 'error', + 'no-await-in-loop': 'error', + 'no-compare-neg-zero': 'error', + 'no-cond-assign': 'error', + 'no-console': 'off', + 'no-constant-condition': 'error', + 'no-control-regex': 'error', + 'no-debugger': 'error', + 'no-dupe-args': 'error', + 'no-dupe-keys': 'error', + 'no-duplicate-case': 'error', + 'no-empty': 'error', + 'no-empty-character-class': 'error', + 'no-ex-assign': 'error', + 'no-extra-boolean-cast': 'error', + 'no-extra-parens': 'off', + 'no-extra-semi': 'error', + 'no-func-assign': 'error', + 'no-inner-declarations': 'error', + 'no-invalid-regexp': 'error', + 'no-irregular-whitespace': 'error', + 'no-misleading-character-class': 'error', + 'no-obj-calls': 'error', + 'no-prototype-builtins': 'error', + 'no-regex-spaces': 'error', + 'no-sparse-arrays': 'error', + 'no-template-curly-in-string': 'error', + 'no-unexpected-multiline': 'error', + 'no-unreachable': 'error', + 'no-unsafe-finally': 'error', + 'no-unsafe-negation': 'error', + 'require-atomic-updates': 'error', + 'use-isnan': 'error', + 'valid-typeof': 'error', + + // #################################################### + // Best practice + // #################################################### + 'accessor-pairs': 'error', + 'array-callback-return': 'error', + 'block-scoped-var': 'error', + 'class-methods-use-this': 'off', + 'complexity': 'off', + 'consistent-return': 'error', + 'curly': 'error', + 'default-case': 'error', + 'dot-location': ['error', 'property'], + 'dot-notation': 'off', + 'eqeqeq': 'error', + 'guard-for-in': 'error', + 'max-classes-per-file': 'error', + 'no-alert': 'error', + 'no-caller': 'error', + 'no-case-declarations': 'error', + 'no-div-regex': 'error', + 'no-else-return': 'error', + 'no-empty-function': 'error', + 'no-empty-pattern': 'error', + 'no-eq-null': 'error', + 'no-eval': 'error', + 'no-extend-native': 'error', + 'no-extra-bind': 'error', + 'no-extra-label': 'error', + 'no-fallthrough': 'error', + 'no-floating-decimal': 'error', + 'no-global-assign': 'error', + 'no-implicit-coercion': 'error', + 'no-implicit-globals': 'error', + 'no-implied-eval': 'error', + 'no-invalid-this': 'off', + 'no-iterator': 'error', + 'no-labels': 'error', + 'no-lone-blocks': 'error', + 'no-loop-func': 'error', + 'no-magic-numbers': 'off', + 'no-multi-spaces': 'error', + 'no-multi-str': 'error', + 'no-new': 'error', + 'no-new-func': 'error', + 'no-new-wrappers': 'error', + 'no-octal': 'error', + 'no-octal-escape': 'error', + 'no-param-reassign': 'error', + 'no-proto': 'error', + 'no-redeclare': 'error', + 'no-restricted-properties': 'error', + 'no-return-assign': 'error', + 'no-return-await': 'error', + 'no-script-url': 'error', + 'no-self-assign': 'error', + 'no-self-compare': 'error', + 'no-sequences': 'error', + 'no-throw-literal': 'error', + 'no-unmodified-loop-condition': 'error', + 'no-unused-expressions': 'error', + 'no-unused-labels': 'error', + 'no-useless-call': 'error', + 'no-useless-catch': 'error', + 'no-useless-concat': 'error', + 'no-useless-escape': 'error', + 'no-useless-return': 'error', + 'no-void': 'error', + 'no-warning-comments': 'error', + 'no-with': 'error', + 'prefer-named-capture-group': 'error', + 'prefer-promise-reject-errors': 'error', + 'radix': 'error', + 'require-await': 'error', + 'require-unicode-regexp': 'error', + 'vars-on-top': 'error', + 'wrap-iife': 'error', + 'yoda': 'error', + + // #################################################### + // Strict mode + // #################################################### + 'strict': 'off', + + // #################################################### + // Variables + // #################################################### + 'init-declarations': 'off', + 'no-delete-var': 'error', + 'no-label-var': 'error', + 'no-restricted-globals': 'error', + 'no-shadow': 'error', + 'no-shadow-restricted-names': 'error', + 'no-undef': 'error', + 'no-undef-init': 'error', + 'no-undefined': 'off', + 'no-unused-vars': 'off', + 'no-use-before-define': 'off', + + // #################################################### + // Node.js + // #################################################### + 'callback-return': 'error', + 'global-require': 'off', + 'handle-callback-err': 'error', + 'no-buffer-constructor': 'error', + 'no-mixed-requires': 'error', + 'no-new-require': 'error', + 'no-path-concat': 'error', + 'no-process-env': 'off', + 'no-process-exit': 'error', + 'no-restricted-modules': 'off', + + // #################################################### + // Stylistic issues + // #################################################### + 'array-bracket-newline': ['error', { 'multiline': true }], + 'array-bracket-spacing': ['error', 'never'], + 'array-element-newline': ['error', 'always'], + 'block-spacing': 'error', + 'brace-style': 'error', + 'capitalized-comments': 'off', + 'comma-dangle': ['error', 'never'], + 'comma-spacing': 'error', + 'comma-style': 'error', + 'computed-property-spacing': 'error', + 'consistent-this': 'error', + 'eol-last': 'error', + 'func-call-spacing': 'error', + 'func-name-matching': 'error', + 'func-names': 'error', + 'func-style': 'error', + 'function-paren-newline': ['error', 'multiline'], + 'id-blacklist': 'off', + 'id-length': 'off', + 'id-match': 'off', + 'implicit-arrow-linebreak': ['error', 'beside'], + 'jsx-quotes': ['error', 'prefer-single'], + 'key-spacing': 'error', + 'keyword-spacing': 'error', + 'line-comment-position': 'error', + 'linebreak-style': 'error', + 'lines-around-comment': 'error', + 'lines-between-class-members': ['error', 'always', { exceptAfterSingleLine: true }], + 'max-depth': ['error', 4], + 'max-len': [ + 'error', + { + 'comments': 80, + 'ignoreStrings': true, + 'ignoreTemplateLiterals': true, + 'code': 200 + } + ], + 'max-lines': 'off', + 'max-lines-per-function': 'off', + 'max-nested-callbacks': ['error', 3], + 'max-params': 'off', + 'max-statements': 'off', + 'max-statements-per-line': ['error', { 'max': 1 }], + 'multiline-comment-style': 'error', + 'multiline-ternary': ['error', 'always'], + 'new-cap': ['error', { 'capIsNewExceptions': ['Component', 'Prop', 'Event', 'State', 'Element', 'Watch'] }], + 'new-parens': 'error', + 'newline-per-chained-call': ['error', { 'ignoreChainWithDepth': 1 }], + 'no-bitwise': 'error', + 'no-continue': 'error', + 'no-inline-comments': 'error', + 'no-lonely-if': 'off', + 'no-mixed-operators': 'error', + 'no-multi-assign': 'error', + 'no-multiple-empty-lines': ['error', { 'max': 1 }], + 'no-negated-condition': 'error', + 'no-nested-ternary': 'error', + 'no-new-object': 'error', + 'no-plusplus': 'off', + 'no-restricted-syntax': 'off', + 'no-tabs': 'error', + 'no-ternary': 'off', + 'no-trailing-spaces': 'error', + 'no-underscore-dangle': 'off', + 'no-unneeded-ternary': 'error', + 'no-whitespace-before-property': 'error', + 'nonblock-statement-body-position': ['error', 'beside'], + 'object-curly-newline': ['error', { + 'ObjectExpression': { + 'minProperties': 1 + }, + 'ObjectPattern': 'always', + 'ImportDeclaration': { + 'minProperties': 2 + }, + 'ExportDeclaration': { + 'minProperties': 2 + } + }], + 'object-curly-spacing': ['error', 'always'], + 'object-property-newline': 'error', + 'one-var': 'off', + 'one-var-declaration-per-line': 'error', + 'operator-assignment': 'error', + 'operator-linebreak': 'error', + 'padded-blocks': 'off', + 'padding-line-between-statements': [ + 'error', + { blankLine: 'always', prev: '*', next: 'return' }, + { blankLine: 'always', prev: ['const', 'let', 'var'], next: '*'}, + { blankLine: 'any', prev: ['const', 'let', 'var'], next: ['const', 'let', 'var']} + ], + 'prefer-object-spread': 'error', + 'quote-props': ['error', 'consistent-as-needed'], + 'quotes': ['error', 'single'], + 'semi-spacing': 'error', + 'semi-style': ['error', 'last'], + 'sort-keys': 'error', + 'sort-vars': 'error', + 'space-before-blocks': 'error', + 'space-before-function-paren': 'off', + 'space-in-parens': ['error', 'never'], + 'space-infix-ops': 'error', + 'space-unary-ops': 'error', + 'spaced-comment': 'error', + 'switch-colon-spacing': 'error', + 'template-tag-spacing': 'error', + 'unicode-bom': 'error', + 'wrap-regex': 'error', + 'indent': 'off', + 'semi': 'off', + 'camelcase': 'off', + 'no-array-constructor': 'off', + + // #################################################### + // ECMAScript 6 + // #################################################### + 'arrow-body-style': ['error', 'as-needed'], + 'arrow-parens': 'error', + 'arrow-spacing': 'error', + 'constructor-super': 'error', + 'generator-star-spacing': 'error', + 'no-class-assign': 'error', + 'no-confusing-arrow': 'error', + 'no-const-assign': 'error', + 'no-dupe-class-members': 'error', + 'no-duplicate-imports': 'error', + 'no-new-symbol': 'error', + 'no-restricted-imports': 'off', + 'no-this-before-super': 'error', + 'no-useless-computed-key': 'error', + 'no-useless-constructor': 'error', + 'no-useless-rename': 'error', + 'no-var': 'error', + 'object-shorthand': 'error', + 'prefer-arrow-callback': 'error', + 'prefer-const': 'error', + 'prefer-destructuring': 'error', + 'prefer-numeric-literals': 'error', + 'prefer-rest-params': 'error', + 'prefer-spread': 'error', + 'prefer-template': 'error', + 'require-yield': 'error', + 'rest-spread-spacing': 'error', + 'sort-imports': ['error', { + 'ignoreCase': true, + 'ignoreDeclarationSort': false, + 'ignoreMemberSort': false, + 'memberSyntaxSortOrder': ['none', 'all', 'multiple', 'single'] + }], + 'symbol-description': 'error', + 'template-curly-spacing': 'error', + 'yield-star-spacing': 'error', + }, }; diff --git a/build.js b/build.js index 6d9dfa19..d5a0ab82 100644 --- a/build.js +++ b/build.js @@ -1,24 +1,23 @@ -const StyleDictionary = require('style-dictionary').extend(__dirname + '/config.js'); +const StyleDictionary = require('style-dictionary') + .extend(`${__dirname}/config.js`); const fs = require('fs'); const _ = require('lodash'); - console.log('Build started...'); console.log('\n=============================================='); StyleDictionary.registerFormat({ - name: 'custom/format/scss', - formatter: _.template(fs.readFileSync(__dirname + '/templates/web-scss.template')) + formatter: _.template(fs.readFileSync(`${__dirname}/templates/web-scss.template`)), + name: 'custom/format/scss' }); StyleDictionary.registerFormat({ - name: 'custom/format/javascript/module', - formatter: _.template(fs.readFileSync(__dirname + '/templates/commonjs.template')) + formatter: _.template(fs.readFileSync(`${__dirname}/templates/commonjs.template`)), + name: 'custom/format/javascript/module' }); // FINALLY, BUILD ALL THE PLATFORMS StyleDictionary.buildAllPlatforms(); - console.log('\n=============================================='); console.log('\nBuild completed!'); diff --git a/ci/gitPushProperties.js b/ci/gitPushProperties.js index faed6a39..103fe1a4 100644 --- a/ci/gitPushProperties.js +++ b/ci/gitPushProperties.js @@ -1,24 +1,32 @@ const shell = require('shelljs'); -const fs = require("fs"); -const path = require("path"); +const fs = require('fs'); +const path = require('path'); const simpleGit = require('simple-git'); -require('dotenv').config(); + +require('dotenv') + .config(); + const git = simpleGit(); -const getAllFiles = function(dirPath, arrayOfFiles) { +const getAllFiles = (dirPath, arrayOfFiles) => { const files = fs.readdirSync(dirPath); - arrayOfFiles = arrayOfFiles || []; + let _arrayOfFiles = arrayOfFiles || []; + + files.forEach((file) => { + const filePath = `${dirPath}/${file}`; + const isDirectory = fs + .statSync(filePath) + .isDirectory(); - files.forEach(function(file) { - if (fs.statSync(dirPath + "/" + file).isDirectory()) { - arrayOfFiles = getAllFiles(dirPath + "/" + file, arrayOfFiles); + if (isDirectory) { + _arrayOfFiles = getAllFiles(filePath, _arrayOfFiles); } else { - arrayOfFiles.push(path.join(dirPath, "/", file)); + _arrayOfFiles.push(path.join(dirPath, '/', file)); } }) - return arrayOfFiles + return _arrayOfFiles; }; (async () => { diff --git a/commitlint.config.js b/commitlint.config.js index 1e1f560e..f69efd50 100644 --- a/commitlint.config.js +++ b/commitlint.config.js @@ -1,21 +1,62 @@ module.exports = { parserPreset: 'conventional-changelog-conventionalcommits', rules: { - 'body-leading-blank': [1, 'always'], - 'body-max-line-length': [2, 'always', 100], - 'footer-leading-blank': [1, 'always'], - 'footer-max-line-length': [2, 'always', 100], - 'header-max-length': [2, 'always', 100], - 'scope-case': [2, 'always', 'lower-case'], + 'body-leading-blank': [ + 1, + 'always' + ], + 'body-max-line-length': [ + 2, + 'always', + 100 + ], + 'footer-leading-blank': [ + 1, + 'always' + ], + 'footer-max-line-length': [ + 2, + 'always', + 100 + ], + 'header-max-length': [ + 2, + 'always', + 100 + ], + 'scope-case': [ + 2, + 'always', + 'lower-case' + ], 'subject-case': [ 2, 'never', - ['sentence-case', 'start-case', 'pascal-case', 'upper-case'] + [ + 'sentence-case', + 'start-case', + 'pascal-case', + 'upper-case' + ] + ], + 'subject-empty': [ + 2, + 'never' + ], + 'subject-full-stop': [ + 2, + 'never', + '.' + ], + 'type-case': [ + 2, + 'always', + 'lower-case' + ], + 'type-empty': [ + 2, + 'never' ], - 'subject-empty': [2, 'never'], - 'subject-full-stop': [2, 'never', '.'], - 'type-case': [2, 'always', 'lower-case'], - 'type-empty': [2, 'never'], 'type-enum': [ 2, 'always', diff --git a/config.js b/config.js index 422cf8a9..b0b37b92 100644 --- a/config.js +++ b/config.js @@ -1,141 +1,188 @@ module.exports = { - source: ["properties/**/*.json"], - // action: { - // buildSketch: { - // do: require('./sketch'), - // undo: () => console.log('no undo') - // } - // }, + + /* + * action: { + * buildSketch: { + * do: require('./sketch'), + * undo: () => console.log('no undo') + * } + * }, + */ platforms: { - scss: { - transformGroup: "scss", - transforms: ["attribute/cti", "name/cti/kebab", "time/seconds", "content/icon", "size/px", "color/css"], - buildPath: "dist/scss/", + + /** + * sketch: { + * transforms: ['attribute/cti','name/cti/snake'], + * actions: ['buildSketch'] + * }, + */ + + android: { + buildPath: 'dist/android/', files: [ { - destination: "_variables.scss", - format: "custom/format/scss" + destination: 'font_dimens.xml', + format: 'android/fontDimens' + }, + { + destination: 'colors.xml', + format: 'android/colors' } + ], + transformGroup: 'android' + }, + css: { + buildPath: 'dist/css/', + files: [ + { + destination: '_variables.css', + format: 'css/variables' + } + ], + transformGroup: 'css', + transforms: [ + 'attribute/cti', + 'name/cti/kebab', + 'time/seconds', + 'content/icon', + 'size/px', + 'color/css' ] }, - less: { - transformGroup: "less", - transforms: ["attribute/cti", "name/cti/kebab", "time/seconds", "content/icon", "size/px", "color/hex"], - buildPath: "dist/less/", - files: [{ - destination: "_variables.less", - format: "less/variables" - }] + ios: { + buildPath: 'dist/ios/', + files: [ + { + className: 'StyleDictionaryColor', + destination: 'StyleDictionaryColor.h', + filter: { + attributes: { + category: 'color' + } + }, + format: 'ios/colors.h', + type: 'StyleDictionaryColorName' + }, + { + className: 'StyleDictionaryColor', + destination: 'StyleDictionaryColor.m', + filter: { + attributes: { + category: 'color' + } + }, + format: 'ios/colors.m', + type: 'StyleDictionaryColorName' + }, + { + className: 'StyleDictionarySize', + destination: 'StyleDictionarySize.h', + filter: { + attributes: { + category: 'size' + } + }, + format: 'ios/static.h', + type: 'float' + }, + { + className: 'StyleDictionarySize', + destination: 'StyleDictionarySize.m', + filter: { + attributes: { + category: 'size' + } + }, + format: 'ios/static.m', + type: 'float' + } + ], + transformGroup: 'ios' }, - css: { - transformGroup: "css", - transforms: ["attribute/cti", "name/cti/kebab", "time/seconds", "content/icon", "size/px", "color/css"], - buildPath: "dist/css/", - files: [{ - destination: "_variables.css", - format: "css/variables" - }] + iosSwift: { + buildPath: 'dist/ios-swift/', + files: [ + { + className: 'StyleDictionary', + destination: 'StyleDictionary.swift', + filter: {}, + format: 'ios-swift/class.swift' + } + ], + transformGroup: 'ios-swift' }, js: { - transformGroup: "js", - transforms: ['attribute/cti', 'name/cti/pascal', 'size/px', 'color/hex'], - buildPath: "dist/js/", + buildPath: 'dist/js/', files: [ { - destination: "tokens.es6.js", - format: "javascript/es6" + destination: 'tokens.es6.js', + format: 'javascript/es6' }, { - destination: "tokens.commonjs.js", - format: "custom/format/javascript/module" + destination: 'tokens.commonjs.js', + format: 'custom/format/javascript/module' }, { - destination: "tokens.umd.js", - format: "javascript/umd" + destination: 'tokens.umd.js', + format: 'javascript/umd' }, { - destination: "tokens.raw.json", - format: "json" + destination: 'tokens.raw.json', + format: 'json' }, { - destination: "tokens.nested.json", - format: "json/nested" + destination: 'tokens.nested.json', + format: 'json/nested' }, { - destination: "tokens.flat.json", - format: "json/flat" + destination: 'tokens.flat.json', + format: 'json/flat' } + ], + transformGroup: 'js', + transforms: [ + 'attribute/cti', + 'name/cti/pascal', + 'size/px', + 'color/hex' ] }, - // sketch: { - // transforms: ['attribute/cti','name/cti/snake'], - // actions: ['buildSketch'] - // }, - android: { - transformGroup: "android", - buildPath: "dist/android/", - files: [{ - destination: "font_dimens.xml", - format: "android/fontDimens" - },{ - destination: "colors.xml", - format: "android/colors" - }] - }, - ios: { - transformGroup: "ios", - buildPath: "dist/ios/", - files: [{ - destination: "StyleDictionaryColor.h", - format: "ios/colors.h", - className: "StyleDictionaryColor", - type: "StyleDictionaryColorName", - filter: { - attributes: { - category: "color" - } - } - },{ - destination: "StyleDictionaryColor.m", - format: "ios/colors.m", - className: "StyleDictionaryColor", - type: "StyleDictionaryColorName", - filter: { - attributes: { - category: "color" - } - } - },{ - destination: "StyleDictionarySize.h", - format: "ios/static.h", - className: "StyleDictionarySize", - type: "float", - filter: { - attributes: { - category: "size" - } - } - },{ - destination: "StyleDictionarySize.m", - format: "ios/static.m", - className: "StyleDictionarySize", - type: "float", - filter: { - attributes: { - category: "size" - } + less: { + buildPath: 'dist/less/', + files: [ + { + destination: '_variables.less', + format: 'less/variables' } - }] + ], + transformGroup: 'less', + transforms: [ + 'attribute/cti', + 'name/cti/kebab', + 'time/seconds', + 'content/icon', + 'size/px', + 'color/hex' + ] }, - iosSwift: { - transformGroup: "ios-swift", - buildPath: "dist/ios-swift/", - files: [{ - destination: "StyleDictionary.swift", - format: "ios-swift/class.swift", - className: "StyleDictionary", - filter: {} - }] + scss: { + buildPath: 'dist/scss/', + files: [ + { + destination: '_variables.scss', + format: 'custom/format/scss' + } + ], + transformGroup: 'scss', + transforms: [ + 'attribute/cti', + 'name/cti/kebab', + 'time/seconds', + 'content/icon', + 'size/px', + 'color/css' + ] } - } + }, + source: ['properties/**/*.json'] } diff --git a/figmaExtractor/figmaApi.js b/figmaExtractor/figmaApi.js index d7a286df..94dd15a2 100644 --- a/figmaExtractor/figmaApi.js +++ b/figmaExtractor/figmaApi.js @@ -13,8 +13,8 @@ module.exports = async (config) => { }; const requestConfig = { - method: 'GET', headers: requestHeaders, + method: 'GET', url: file }; @@ -23,6 +23,6 @@ module.exports = async (config) => { return figmaJson.data; } catch (e) { - throw new Error('figmaApi.js: ' + e.message); + throw new Error(`figmaApi.js: ${e.message}`); } } diff --git a/figmaExtractor/figmaExtractor.js b/figmaExtractor/figmaExtractor.js index fade40dd..7ec84d68 100644 --- a/figmaExtractor/figmaExtractor.js +++ b/figmaExtractor/figmaExtractor.js @@ -4,21 +4,22 @@ const getFigmaFrames = require('./figmaFrames'); const getFigmaJson = require('./figmaJson'); const writeJson = require('./figmaWriteJson'); -require('dotenv').config(); +require('dotenv') + .config(); // general configuration const config = { figma: { - frameNames: { - color: 'color', - fontSize: 'font-size' - }, childTypes: { + component: 'COMPONENT', frame: 'FRAME', group: 'GROUP', - text: 'TEXT', rectangle: 'RECTANGLE', - component: 'COMPONENT' + text: 'TEXT' + }, + frameNames: { + color: 'color', + fontSize: 'font-size' }, styleTypes: { color: 'color', @@ -35,8 +36,8 @@ const config = { try { const apiConfig = { - token: process.env.FIGMA_ACCESS_TOKEN, - file: process.env.FIGMA_FILE_URL + file: process.env.FIGMA_FILE_URL, + token: process.env.FIGMA_ACCESS_TOKEN }; const figmaData = await figmaApi(apiConfig); diff --git a/figmaExtractor/figmaFrames.js b/figmaExtractor/figmaFrames.js index 9a31083a..6f0f55fa 100644 --- a/figmaExtractor/figmaFrames.js +++ b/figmaExtractor/figmaFrames.js @@ -15,20 +15,22 @@ module.exports = (figmaData, config) => { throw new Error('ERROR: Figma file seems not to have any pages'); } - // get the first page. By convention, we put all definitions on - // the first page - const figmaPage = figmaPages[0]; + /** + * get the first page. By convention, we put all definitions on + * the first page + */ + const [figmaPage] = figmaPages; // make sure that 1st page has regions - let figmaChildren = figmaPage.children; + const { + children + } = figmaPage; - if (!figmaChildren || figmaChildren.length < 1) { + if (!children || children.length < 1) { throw new Error('ERROR: 1st page of the Figma file does not have any children'); } - const figmaFrames = figmaChildren.filter((frame) => { - return frame.type === config.figma.childTypes.frame; - }); + const figmaFrames = children.filter((frame) => frame.type === config.figma.childTypes.frame); if (figmaFrames.length < 1) { throw new Error('ERROR: 1st page of the Figma file does not have any frames'); diff --git a/figmaExtractor/figmaJson.js b/figmaExtractor/figmaJson.js index 84f2925a..3e309914 100644 --- a/figmaExtractor/figmaJson.js +++ b/figmaExtractor/figmaJson.js @@ -1,38 +1,43 @@ // get frame for specified name -const getFrameForName = (name, frames) => { - return frames.filter((frame) => frame.name === name)[0]; -}; +const getFrameForName = (name, frames) => frames.filter((frame) => frame.name === name)[0]; // get hex from rgba const rgbaToHex = (color) => { - let r = parseInt(color.r * 255).toString(16); - let g = parseInt(color.g * 255).toString(16); - let b = parseInt(color.b * 255).toString(16); + let r = parseInt(color.r * 255, 10) + .toString(16); + + let g = parseInt(color.g * 255, 10) + .toString(16); + + let b = parseInt(color.b * 255, 10) + .toString(16); if (r.length === 1) { - r = '0' + r; + r = `0${r}`; } if (g.length === 1) { - g = '0' + g; + g = `0${g}` } if (b.length === 1) { - b = '0' + b; + b = `0${b}` } - return '#' + r + g + b; + return `#${r}${g}${b}`; }; -// iterate children until no more children are found and build up the final -// json +/** + * iterate children until no more children are found and build up the + * final json + */ const buildFinalJson = (children, finalJson, figmaType, styleProperty, config) => { while (children.length > 0) { const child = children.pop(); if (child.type === config.figma.childTypes.component) { - const realChild = child.children[0]; + const [realChild] = child.children; let value; if (styleProperty === config.figma.styleTypes.color) { @@ -42,7 +47,7 @@ const buildFinalJson = (children, finalJson, figmaType, styleProperty, config) = } finalJson[realChild.name] = { - value: value + value }; } else if (child.type === config.figma.childTypes.group) { const groupChildren = child.children; @@ -56,7 +61,6 @@ const buildFinalJson = (children, finalJson, figmaType, styleProperty, config) = }; module.exports = (frames, config) => { - const designTokens = []; // build colors const colorFrame = getFrameForName(config.figma.frameNames.color, frames); @@ -69,7 +73,8 @@ module.exports = (frames, config) => { const fontSizeJson = buildFinalJson(typoChildren, {}, config.figma.childTypes.text, config.figma.styleTypes.fontSize, config); return { - color: { // this key will be the file name of the json + // this key will be the file name of the json + color: { color: colorJson }, size: { diff --git a/figmaExtractor/figmaWriteJson.js b/figmaExtractor/figmaWriteJson.js index 50440481..09de4031 100644 --- a/figmaExtractor/figmaWriteJson.js +++ b/figmaExtractor/figmaWriteJson.js @@ -4,12 +4,15 @@ module.exports = (json, config) => { // make sure directory is there const outputFolder = `./${config.output.folder}`; + if (!fs.existsSync(outputFolder)) { fs.mkdirSync(outputFolder); } - // the main keys in the object are used as - // file names for the json files + /** + * the main keys in the object are used as + * file names for the json files + */ const keys = Object.keys(json); keys.forEach((key) => { diff --git a/package.json b/package.json index 0845766d..81600d66 100644 --- a/package.json +++ b/package.json @@ -32,7 +32,8 @@ "build": "npm run figma:extract && npm run build:stiledictionary", "build:stiledictionary": "node ./build.js", "figma:extract": "node figmaExtractor/figmaExtractor.js", - "lint": "npm run lint:yml", + "lint": "npm run lint:yml && npm run lint:js", + "lint:js": "eslint ./ --ext .js", "lint:yml": "eslint ./ --ext .yml,.yaml", "semantic-release": "semantic-release" }, diff --git a/sketch/ColorPage.js b/sketch/ColorPage.js index 451764b7..1f9d1d8f 100644 --- a/sketch/ColorPage.js +++ b/sketch/ColorPage.js @@ -1,3 +1,5 @@ +/* eslint-disable */ + /* const { Page, Artboard } = require('sketch-constructor'); const colorGroup = require('./colorGroup'); diff --git a/sketch/Swatch.js b/sketch/Swatch.js index 0c8cb76f..52262263 100644 --- a/sketch/Swatch.js +++ b/sketch/Swatch.js @@ -1,3 +1,5 @@ +/* eslint-disable */ + /* const { Group, Text, Rectangle } = require('sketch-constructor'); diff --git a/sketch/colorGroup.js b/sketch/colorGroup.js index 24f70e2c..4349b049 100644 --- a/sketch/colorGroup.js +++ b/sketch/colorGroup.js @@ -1,3 +1,5 @@ +/* eslint-disable */ + /* const { Group, stackLayers } = require('sketch-constructor'); const Swatch = require('./Swatch'); diff --git a/sketch/index.js b/sketch/index.js index 0a2351a0..e7f8bdda 100644 --- a/sketch/index.js +++ b/sketch/index.js @@ -1,3 +1,5 @@ +/* eslint-disable */ + /* const { Sketch } = require('sketch-constructor'); const ColorPage = require('./ColorPage');