chore: lint all styles and js (#847)

* chore: lint all JS

* style: add two lint fix scripts

* fix: match jest config src folder

* chore(lint): Fix stylelint-prettier and lint scss and css files

Co-authored-by: Mark Palfreeman <[email protected]>
Co-authored-by: bcullman <[email protected]>

.eslintignore

@@ -1,10 +1 @@
-.idea/
-*.css
-*.opts
-*.scss
-*.snap
-*.svg
-*.sh
-*.md
-node_modules/**
-*.png
+!/.storybook

.storybook/config.js

@@ -1,5 +1,5 @@
-import { addDecorator, configure } from '@storybook/react';
 import { withA11y } from '@storybook/addon-a11y';
+import { addDecorator, configure } from '@storybook/react';
 
 addDecorator(withA11y);
 

.storybook/webpack.config.js

@@ -1,10 +1,8 @@
-const path = require('path');
-
 module.exports = function({ config }) {
     config.module.rules.push({
         test: /\.stories\.js?$/,
         loaders: [require.resolve('@storybook/source-loader')],
-        enforce: 'pre',
+        enforce: 'pre'
     });
     return config;
 };

.stylelintrc

@@ -0,0 +1,6 @@
+{
+    "extends": ["stylelint-prettier/recommended"],
+    "rules": {
+        "prettier/prettier": [true, {"singleQuote": true, "tabWidth": 4}]
+    }
+}

config/jest/jest.config.js

@@ -1,11 +1,11 @@
 module.exports = {
-    'rootDir': '../../src/',
-    'verbose': true,
-    'testURL': 'http://localhost/',
-    'testMatch': ['**/*.test.js'],
-    'setupFiles': ['../config/jest/setup.js'],
-    'moduleFileExtensions': ['js', 'json', 'jsx', 'css', 'node'],
-    'moduleNameMapper': {
+    rootDir: '../../src/',
+    verbose: true,
+    testURL: 'http://localhost/',
+    testMatch: ['**/*.test.js'],
+    setupFiles: ['../config/jest/setup.js'],
+    moduleFileExtensions: ['js', 'json', 'jsx', 'css', 'node'],
+    moduleNameMapper: {
         '^.+\\.(css)$': 'babel-jest'
     }
 };

package.json

@@ -15,30 +15,27 @@
     "build-doc": "node scripts/build.js && cp build/index.html build/404.html",
     "build:copy-files": "cp -rf package.json README.md NOTICE.txt LICENSE.txt CHANGELOG.md lib",
     "build:index": "babel-node devtools/buildIndexFiles.js",
-    "build:lint:fix": "npm run build:lint -- --fix",
-    "build:lint": "eslint 'src/**' --ext .js,.jsx --env browser,node",
     "build:cjs": "cross-env NODE_ENV=production BABEL_ENV=cjs babel src --out-dir lib --ignore \"src/**/*.spec.js\",\"src/**/*.test.js\",\"src/**/*.Component.js\",\"src/_playground/*\",\"src/**/*.stories.js\"",
     "build": "npm run build:index && rm -rf lib && npm run build:cjs",
-    "config:lint": "eslint 'config/**' --ext .js,.jsx --env browser,node",
     "deploy": "gh-pages -d build",
-    "devtools:lint": "eslint 'devtools/**' --ext .js,.jsx --env browser,node",
     "docs:dev": "FUNDAMENTAL_REACT_PLAYGROUND=true npm start",
     "dry-run": "npm run build && npm run build:copy-files && npm publish lib --dry-run",
-    "lint:fix": "npm run build:lint:fix  && npm run scripts:lint:fix && npm run config:lint:fix",
+    "lint": "npm run lint:code && npm run lint:style",
+    "lint:fix": "npm run lint:code:fix && npm run lint:style:fix",
+    "lint:code": "eslint . --ext .js,.jsx",
+    "lint:code:fix": "npm run lint:code -- --fix",
+    "lint:style": "stylelint \"src/**/*.scss\" \"src/**/*.css\"",
+    "lint:style:fix": "npm run lint:style -- --fix",
     "lint:pre-commit": "printf \"running pre-commit lint...\"  && npm run lint && printf \"done!\n\"",
-    "lint": "npm run build:lint && npm run scripts:lint && npm run config:lint && npm run devtools:lint && npm run style:lint",
     "release:create": "create-release",
     "release": "./scripts/publish-release.sh",
-    "scripts:lint:fix": "npm run scripts:lint -- --fix",
-    "scripts:lint": "eslint 'scripts/**' --ext .js,.jsx --env browser,node",
     "size": "npm run build && size-limit",
     "size:debug": "npm run build && size-limit --why",
     "start": "npm run build && node scripts/start.js",
     "start:playground": "npm run storybook",
     "std-version": "standard-version -m \"chore(release): version %s build ${TRAVIS_BUILD_NUMBER} [ci skip]\"",
     "storybook": "start-storybook -p 12123",
     "storybook:ci": "npm run storybook -- --ci --quiet",
-    "style:lint": "stylelint 'src/**/*.scss' 'src/**/*.css'",
     "test:coverage:watch": "npm run test:coverage -- --watch",
     "test:coverage": "npm run test:dev -- --coverage",
     "test:coveralls": "cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js || echo -e \"Coveralls failed.\"",
@@ -130,6 +127,7 @@
     "postcss-preset-env": "6.7.0",
     "postcss-safe-parser": "4.0.1",
     "pre-commit": "^1.2.2",
+    "prettier": "^1.19.1",
     "react": "^16.8.0",
     "react-dev-utils": "^7.0.5",
     "react-dom": "^16.8.0",
@@ -149,6 +147,8 @@
     "start-server-and-test": "^1.10.6",
     "style-loader": "1.0.0",
     "stylelint": "^12.0.0",
+    "stylelint-config-prettier": "^8.0.0",
+    "stylelint-prettier": "^1.1.2",
     "terser-webpack-plugin": "2.0.1",
     "tocbot": "^4.5.0",
     "url-loader": "2.1.0",

src/_playground/_content.scss

@@ -9,7 +9,7 @@
     padding-top: $menu-height + 25px;
 
     &__header,
-    .frDocs-markdown>h1 {
+    .frDocs-markdown > h1 {
         margin: 0 0 12px;
         font-size: 2.2rem;
         line-height: 1;
@@ -20,7 +20,7 @@
     }
 
     &__description,
-    .frDocs-markdown>p {
+    .frDocs-markdown > p {
         margin-bottom: 1.5rem;
         font-size: 1rem;
         font-weight: 300;
@@ -58,7 +58,7 @@
     }
 
     &__tile-background {
-        background: #F3F4F5;
+        background: #f3f4f5;
         transition: background-color 0.25s;
     }
 
@@ -69,7 +69,7 @@
     &__separator {
         display: block;
         margin: 2rem 0;
-        border-bottom: 1px solid #E3E3E3;
+        border-bottom: 1px solid #e3e3e3;
     }
 
     &__docsText {

src/_playground/_nav.scss

@@ -28,7 +28,7 @@
     color: #fff;
 
     &:hover {
-        color: #32363A;
+        color: #32363a;
     }
 }