Support .babelrc.js and babel.config.js when looking for configs (#619)

* Support .babelrc.js and babel.config.js when looking for configs

* lint

* Update package.json

* Create .prettierrc

* fix e2e tests

.eslintrc.json

@@ -1,5 +1,3 @@
 {
-  "extends": [
-    "./packages/eslint-config-kyt/eslintrc.json"
-  ]
+  "extends": ["eslint-config-kyt"]
 }

.gitignore

@@ -1,3 +1,5 @@
+stage-cli
+
 # Logs
 logs
 *.log

.prettierrc

@@ -0,0 +1,6 @@
+{
+  "singleQuote": true,
+  "trailingComma": "es5",
+  "arrowParens": "avoid",
+  "printWidth": 100
+}

jest.config.js

@@ -0,0 +1,15 @@
+module.exports = {
+  testPathIgnorePatterns: [
+    '<rootDir>/packages/kyt-starter-*',
+    '<rootDir>/packages/kyt-core/cli/actions/test.js',
+    '<rootDir>/e2e_tests',
+  ],
+  collectCoverageFrom: ['**/*.js'],
+  coveragePathIgnorePatterns: [
+    '<rootDir>/node_modules',
+    '<rootDir>/packages/*/node_modules',
+    '<rootDir>/packages/kyt-starter-*',
+    '<rootDir>/coverage',
+    '<rootDir>/packages/kyt-core/utils/jest',
+  ],
+};

package.json

@@ -11,41 +11,25 @@
   "directories": {
     "doc": "docs"
   },
-  "jest": {
-    "testPathIgnorePatterns": [
-      "<rootDir>/packages/kyt-starter-*",
-      "<rootDir>/packages/kyt-core/cli/actions/test.js",
-      "<rootDir>/e2e_tests"
-    ],
-    "collectCoverageFrom": [
-      "**/*.js"
-    ],
-    "coveragePathIgnorePatterns": [
-      "<rootDir>/node_modules",
-      "<rootDir>/packages/*/node_modules",
-      "<rootDir>/packages/kyt-starter-*",
-      "<rootDir>/coverage",
-      "<rootDir>/packages/kyt-core/utils/jest"
-    ]
-  },
   "scripts": {
     "bootstrap": "npm i && lerna bootstrap",
-    "clean-bootstrap": "rm -rf node_modules && npm i && lerna clean --yes && npm run bootstrap",
+    "clean-bootstrap": "rm -rf node_modules && lerna clean --yes && npm run bootstrap",
     "publish-pre": "lerna publish --exact --npm-tag=pre --canary=alpha",
     "publish-next": "lerna publish --exact --npm-tag=next --canary=beta",
     "publish-release": "lerna publish --exact --message",
-    "test": "jest && cd packages/kyt-starter-universal/starter-src && node_modules/.bin/kyt test && cd  ../../kyt-starter-static/starter-src && node_modules/.bin/kyt test",
-    "test-update": "jest -u && cd packages/kyt-starter-universal/starter-src && node_modules/.bin/kyt test -- -u && cd  ../../kyt-starter-static/starter-src && node_modules/.bin/kyt test -- -u",
+    "test:universal": "cd packages/kyt-starter-universal/starter-src && kyt test",
+    "test:static": "cd packages/kyt-starter-static/starter-src && kyt test",
+    "test": "jest && npm run test:universal && npm run test:static",
+    "test-update": "jest && npm run test:universal -- -u && npm run test:static -- -u",
     "test-watch": "jest --watch",
     "test-coverage": "jest --coverage",
     "e2e": "jest --config ./e2e_tests/jest.config.json --verbose --no-cache",
     "lint": "packages/kyt-core/node_modules/.bin/eslint ./",
-    "lint-fix": "packages/kyt-core/node_modules/.bin/eslint ./ --fix"
+    "lint-fix": "npm run lint -- --fix"
   },
   "devDependencies": {
     "lerna": "^2.0.0",
     "eslint-config-kyt": "file:packages/eslint-config-kyt",
     "eslint-plugin-kyt": "file:packages/eslint-plugin-kyt"
-  },
-  "dependencies": {}
+  }
 }

packages/eslint-config-kyt/eslintrc.json

@@ -2,6 +2,7 @@
   "extends": [
     "airbnb",
     "plugin:prettier/recommended",
+    "plugin:json/recommended",
     "prettier/react"
   ],
 

packages/eslint-config-kyt/package.json

@@ -9,18 +9,18 @@
   "bugs": "https://github.com/nytimes/kyt/issues",
   "homepage": "https://github.com/nytimes/kyt#readme",
   "peerDependencies": {
-    "babel-eslint": "10.0.1",
-    "eslint": "5.16.0",
-    "eslint-config-airbnb": "17.1.0",
-    "eslint-config-prettier": "4.2.0",
-    "eslint-plugin-import": "2.17.2",
-    "eslint-plugin-json": "1.4.0",
-    "eslint-plugin-jsx-a11y": "6.2.1",
+    "babel-eslint": "^10.0.3",
+    "eslint": "^5.16.0",
+    "eslint-config-airbnb": "^18.0.1",
+    "eslint-config-prettier": "^6.9.0",
+    "eslint-plugin-import": "^2.19.1",
+    "eslint-plugin-json": "^2.0.1",
+    "eslint-plugin-jsx-a11y": "^6.2.3",
     "eslint-plugin-kyt": "pre",
-    "eslint-plugin-prettier": "3.1.0",
-    "eslint-plugin-react": "7.13.0",
-    "eslint-plugin-react-hooks": "1.6.0",
-    "prettier": "1.17.1"
+    "eslint-plugin-prettier": "^3.1.2",
+    "eslint-plugin-react": "^7.17.0",
+    "eslint-plugin-react-hooks": "^2.3.0",
+    "prettier": "^1.19.1"
   },
   "keywords": [
     "kyt",

packages/kyt-cli/cli/actions/setup.js

@@ -58,9 +58,7 @@ module.exports = (flags, args) => {
         if (!semver.satisfies(kytVersion, kytStarterPreferredVersion)) {
           // eslint-disable-next-line max-len
           logger.warn(
-            `${
-              tempPackageJSON.name
-            } requires kyt version ${kytStarterPreferredVersion} but kyt ${kytVersion} is installed.`
+            `${tempPackageJSON.name} requires kyt version ${kytStarterPreferredVersion} but kyt ${kytVersion} is installed.`
           );
         }
       }
@@ -195,7 +193,7 @@ module.exports = (flags, args) => {
       logger.task('Creating a new package.json. You should fill it in.');
     }
     // Clone the package.json so that we have a backup.
-    oldPackageJSON = Object.assign({}, userPackageJSON);
+    oldPackageJSON = { ...userPackageJSON };
 
     // Add dependencies from starter-kyts
     if (!existingProject) {

packages/kyt-core/.browserslistrc

@@ -0,0 +1,2 @@
+last 2 versions
+ios 8

packages/kyt-core/__mocks__/eslint.js

@@ -16,5 +16,5 @@ const eslintMock = { CLIEngine };
 module.exports = eslintMock;
 // eslint-disable-next-line no-underscore-dangle
 module.exports.__setExecuteOnFiles = newVals => {
-  customExecuteOnFiles = Object.assign({}, customExecuteOnFiles, newVals);
+  customExecuteOnFiles = { ...customExecuteOnFiles, ...newVals };
 };

packages/kyt-core/cli/actions/__tests__/proto.test.js

@@ -6,7 +6,10 @@ jest.mock('kyt-utils/logger');
 jest.mock('shelljs');
 
 const listen = jest.fn();
-jest.setMock('webpack-dev-server', jest.fn(() => ({ listen })));
+jest.setMock(
+  'webpack-dev-server',
+  jest.fn(() => ({ listen }))
+);
 
 const config = {
   modifyWebpackConfig: jest.fn(c => c),

packages/kyt-core/config/__tests__/webpack.test.js

@@ -2,10 +2,6 @@ const fs = {
   readFileSync: jest.fn(),
 };
 
-const shell = {
-  test: jest.fn(),
-};
-
 const logger = {
   warn: jest.fn(),
 };
@@ -18,6 +14,10 @@ const path = {
 const extractPlugin = jest.fn();
 extractPlugin.extract = jest.fn();
 
+const findBabelConfig = {
+  sync: jest.fn(),
+};
+
 const webpack = {
   LoaderOptionsPlugin: jest.fn(),
   optimize: {
@@ -35,12 +35,12 @@ const webpack = {
 };
 
 jest.setMock('fs', fs);
-jest.setMock('shelljs', shell);
 jest.setMock('path', path);
 jest.setMock('kyt-utils/logger', logger);
 jest.setMock('webpack', webpack);
 jest.setMock('../../utils/getPostcssLoader', {});
 jest.setMock('mini-css-extract-plugin', extractPlugin);
+jest.setMock('find-babel-config', findBabelConfig);
 
 const baseConfig = require('../webpack.base');
 
@@ -50,15 +50,15 @@ describe('webpack.base', () => {
     webpack.DefinePlugin.mockClear();
   });
   it("doesn't set up a babel preset if a .babelrc exists", () => {
-    shell.test.mockImplementationOnce(() => true);
+    findBabelConfig.sync.mockImplementationOnce(() => ({ config: {} }));
     fs.readFileSync.mockImplementationOnce(() => '{}');
     const config = baseConfig({ clientURL: {}, publicPath: '/' });
     const babelLoader = config.module.rules.find(({ loader }) => loader === 'babel-loader');
     expect(babelLoader.options.presets).toBeUndefined();
     expect(logger.warn).not.toHaveBeenCalled();
   });
   it('sets up kyt-core babel preset if a .babelrc exists', () => {
-    shell.test.mockImplementationOnce(() => false);
+    findBabelConfig.sync.mockImplementationOnce(() => ({ config: null }));
     fs.readFileSync.mockImplementationOnce(() => '{}');
     const config = baseConfig({ clientURL: {}, publicPath: '/' });
     const babelLoader = config.module.rules.find(({ loader }) => loader === 'babel-loader');

packages/kyt-core/config/jest.js

@@ -6,13 +6,11 @@ const resolveFromUtils = file => path.resolve(__dirname, '..', 'utils', 'jest',
 // For configuration information, see:
 // https://facebook.github.io/jest/docs/api.html#configuration-options-configuration
 module.exports = (rootDir, aliases = {}) => ({
-  moduleNameMapper: Object.assign(
-    {
-      [fileExtensions]: resolveFromUtils('file.stub'),
-      '^[./a-zA-Z0-9!&$_-]+\\.(css|scss)$': 'identity-obj-proxy',
-    },
-    aliases
-  ),
+  moduleNameMapper: {
+    [fileExtensions]: resolveFromUtils('file.stub'),
+    '^[./a-zA-Z0-9!&$_-]+\\.(css|scss)$': 'identity-obj-proxy',
+    ...aliases,
+  },
   moduleFileExtensions: ['js', 'jsx', 'json'],
   verbose: true,
   transform: { '^.+\\.(js)$': resolveFromUtils('preprocessor') },

packages/kyt-core/config/postcss.config.js

@@ -1,5 +1,5 @@
 const autoprefixer = require('autoprefixer');
 
 module.exports = {
-  plugins: [autoprefixer({ browsers: ['last 2 versions', 'ios 8'] })],
+  plugins: [autoprefixer()],
 };

packages/kyt-core/config/webpack.base.js

@@ -3,16 +3,15 @@
 // https://github.com/survivejs/webpack-merge
 
 const path = require('path');
-const fs = require('fs');
 const webpack = require('webpack');
 const WebpackBar = require('webpackbar');
-const shell = require('shelljs');
 const merge = require('webpack-merge');
+const findBabelConfigSync = require('find-babel-config').sync;
 
 const {
   buildPath,
   userNodeModulesPath,
-  userBabelrcPath,
+  userRootPath,
   publicSrcPath,
   clientAssetsFile,
   loadableAssetsFile,
@@ -21,10 +20,9 @@ const os = require('os');
 const fileExtensions = require('./fileExtensions');
 
 module.exports = options => {
-  let babelrc;
-  if (shell.test('-f', userBabelrcPath)) {
-    const rcFile = fs.readFileSync(userBabelrcPath);
-    babelrc = JSON.parse(rcFile);
+  let babelrc = findBabelConfigSync(userRootPath);
+  if (babelrc) {
+    babelrc = babelrc.config;
   }
 
   return {