feat: update babel 7 (#95)

christophehurpeau · web-flow · commit aa98706e954d · 2019-07-12T11:42:15.000+02:00
* chore: update jest

* feat: update babel 7
diff --git a/.babel.config.js b/.babel.config.js
@@ -0,0 +1,4 @@
+module.exports = {
+  "only": ["test/"],
+  "plugins": ["@babel/plugin-transform-async-to-generator"]
+}
diff --git a/.babelrc b/.babelrc
diff --git a/_sandbox/webpack.config.js b/_sandbox/webpack.config.js
@@ -19,7 +19,7 @@ module.exports = {
       },
       {
         test: /\.jsx?$/,
-        loader: 'babel-loader',
+        loader: require.resolve('babel-loader-7'),
         query: {
           presets: ['react'],
         },
diff --git a/index.js b/index.js
@@ -1,4 +1,5 @@
 
 const FriendlyErrorsWebpackPlugin = require('./src/friendly-errors-plugin');
 
-module.exports = FriendlyErrorsWebpackPlugin;
+module.exports = FriendlyErrorsWebpackPlugin;
+module.exports.default = FriendlyErrorsWebpackPlugin;
diff --git a/package.json b/package.json
@@ -28,22 +28,27 @@
     "url": "https://github.com/geowarin/friendly-errors-webpack-plugin/issues"
   },
   "license": "MIT",
+  "jest": {
+    "testEnvironment": "node",
+    "transformIgnorePatterns": ["node_modules", "src", "index.js"]
+  },
   "peerDependencies": {
     "webpack": "^4.0.0"
   },
   "devDependencies": {
+    "@babel/core": "^7.5.4",
+    "@babel/plugin-transform-async-to-generator": "^7.5.0",
     "autoprefixer": "^9.6.0",
-    "babel-core": "^6.23.1",
+    "babel-core": "6.26.3",
     "babel-eslint": "^10.0.1",
-    "babel-loader": "^7.1.4",
-    "babel-plugin-transform-async-to-generator": "^6.24.1",
-    "babel-preset-react": "^6.23.0",
+    "babel-loader-8@npm:babel-loader": "^8.0.6",
+    "babel-loader-7@npm:babel-loader": "^7.1.4",
     "css-loader": "^2.1.1",
     "eslint": "^5.16.0",
     "eslint-loader": "^2.1.2",
     "eslint-plugin-node": "^9.0.1",
     "expect": "^24.8.0",
-    "jest": "^18.1.0",
+    "jest": "^24.8.0",
     "memory-fs": "^0.4.1",
     "mini-css-extract-plugin": "^0.6.0",
     "node-sass": "^4.12.0",
diff --git a/src/transformers/babelSyntax.js b/src/transformers/babelSyntax.js
@@ -18,8 +18,8 @@ function cleanMessage(message) {
     .replace(/^Module build failed.*:\s/, 'Syntax Error: ')
     // remove mini-css-extract-plugin loader tracing errors
     .replace(/^Syntax Error: ModuleBuildError:.*:\s/, '')
-    // remove babel extra wording
-    .replace('SyntaxError: ', '');
+    // remove babel extra wording and path
+    .replace(/^Syntax Error: SyntaxError: (([A-Z]:)?\/.*:\s)?/, 'Syntax Error: ');
 }
 
 function isBabelSyntaxError(e) {
diff --git a/test/fixtures/babel-syntax-babel-6/.babelrc b/test/fixtures/babel-syntax-babel-6/.babelrc
@@ -0,0 +1 @@
+{}
diff --git a/test/fixtures/babel-syntax-babel-6/index.js b/test/fixtures/babel-syntax-babel-6/index.js
diff --git a/test/fixtures/babel-syntax-babel-6/webpack.config.js b/test/fixtures/babel-syntax-babel-6/webpack.config.js
@@ -15,7 +15,7 @@ module.exports = {
       {
         test: /\.jsx?$/,
         exclude: /node_modules/,
-        loader: 'babel-loader',
+        loader: require.resolve('babel-loader-7'),
       }
     ]
   },
diff --git a/test/fixtures/babel-syntax-babel-7/.babelrc b/test/fixtures/babel-syntax-babel-7/.babelrc
@@ -0,0 +1 @@
+{}
diff --git a/test/fixtures/babel-syntax-babel-7/index.js b/test/fixtures/babel-syntax-babel-7/index.js
@@ -0,0 +1,7 @@
+
+class MyComponent extends React.Component {
+
+  render() {
+    return <div>
+  }
+}
diff --git a/test/fixtures/babel-syntax-babel-7/webpack.config.js b/test/fixtures/babel-syntax-babel-7/webpack.config.js
@@ -0,0 +1,22 @@
+const FriendlyErrorsWebpackPlugin = require('../../../index');
+
+module.exports = {
+  mode: 'development',
+  entry: __dirname + "/index.js",
+  output: {
+    path: __dirname + "/dist",
+    filename: "bundle.js"
+  },
+  plugins: [
+    new FriendlyErrorsWebpackPlugin()
+  ],
+  module: {
+    rules: [
+      {
+        test: /\.jsx?$/,
+        exclude: /node_modules/,
+        loader: require.resolve('babel-loader-8'),
+      }
+    ]
+  },
+};
diff --git a/test/fixtures/eslint-warnings/webpack.config.js b/test/fixtures/eslint-warnings/webpack.config.js
@@ -22,7 +22,7 @@ module.exports = {
       {
         test: /\.jsx?$/,
         exclude: /node_modules/,
-        loader: 'babel-loader',
+        loader: require.resolve('babel-loader-7'),
       }
     ]
   },
diff --git a/test/integration.spec.js b/test/integration.spec.js
@@ -37,7 +37,7 @@ it('integration : success', async() => {
 
   const logs = await executeAndGetLogs('./fixtures/success/webpack.config')
 
-  expect(logs.join('\n')).toMatch(/DONE  Compiled successfully in (.\d*)ms/);
+  expect(logs.join('\n')).toMatch(/DONE {2}Compiled successfully in (.\d*)ms/);
 });
 
 it('integration : module-errors', async() => {
@@ -93,14 +93,34 @@ Use /* eslint-disable */ to ignore all warnings in a file.`
   )
 });
 
-it('integration : babel syntax error', async() => {
+it('integration : babel syntax error with babel-loader 7 (babel 6)', async() => {
 
-  const logs = await executeAndGetLogs('./fixtures/babel-syntax/webpack.config');
+  const logs = await executeAndGetLogs('./fixtures/babel-syntax-babel-6/webpack.config');
 
   expect(logs).toEqual([
     'ERROR  Failed to compile with 1 errors',
     '',
-    'error  in ./test/fixtures/babel-syntax/index.js',
+    'error  in ./test/fixtures/babel-syntax-babel-6/index.js',
+    '',
+    `Syntax Error: Unexpected token (5:11)
+
+  3 |${' '}
+  4 |   render() {
+> 5 |     return <div>
+    |            ^
+  6 |   }
+  7 | }`,
+    ''
+  ]);
+});
+it('integration : babel syntax error with babel-loader 8 (babel 7)', async() => {
+
+  const logs = await executeAndGetLogs('./fixtures/babel-syntax-babel-7/webpack.config');
+
+  expect(logs).toEqual([
+    'ERROR  Failed to compile with 1 errors',
+    '',
+    'error  in ./test/fixtures/babel-syntax-babel-7/index.js',
     '',
     `Syntax Error: Unexpected token (5:11)
 
@@ -137,7 +157,7 @@ it('integration : webpack multi compiler : success', async() => {
   let globalPlugins = [new FriendlyErrorsWebpackPlugin()];
   const logs = await executeAndGetLogs('./fixtures/multi-compiler-success/webpack.config', globalPlugins);
 
-  expect(logs.join('\n')).toMatch(/DONE  Compiled successfully in (.\d*)ms/)
+  expect(logs.join('\n')).toMatch(/DONE {2}Compiled successfully in (.\d*)ms/)
 });
 
 it('integration : webpack multi compiler : module-errors', async() => {
diff --git a/yarn.lock b/yarn.lock

Original file line number	Diff line number	Diff line change
`@@ -19,7 +19,7 @@ module.exports = {`
`19`	`19`	`},`
`20`	`20`	`{`
`21`	`21`	`test: /\.jsx?$/,`
`22`		`- loader: 'babel-loader',`
	`22`	`+ loader: require.resolve('babel-loader-7'),`
`23`	`23`	`query: {`
`24`	`24`	`presets: ['react'],`
`25`	`25`	`},`
Original file line number	Diff line number	Diff line change
`@@ -15,7 +15,7 @@ module.exports = {`
`15`	`15`	`{`
`16`	`16`	`test: /\.jsx?$/,`
`17`	`17`	`exclude: /node_modules/,`
`18`		`- loader: 'babel-loader',`
	`18`	`+ loader: require.resolve('babel-loader-7'),`
`19`	`19`	`}`
`20`	`20`	`]`
`21`	`21`	`},`