From 9819f32d1440267db252153a85555bdde355310a Mon Sep 17 00:00:00 2001 From: Jose Miguel Gallas Date: Tue, 18 Dec 2018 15:34:46 +0100 Subject: [PATCH 1/3] [webpacker] fixes webpack config files --- config/webpack/development.js | 46 ++++++++--------------------------- config/webpack/environment.js | 27 +++++++++++++++++++- config/webpack/production.js | 30 ++--------------------- config/webpack/test.js | 30 ++--------------------- 4 files changed, 40 insertions(+), 93 deletions(-) diff --git a/config/webpack/development.js b/config/webpack/development.js index 67baa2a333..3df14182a8 100644 --- a/config/webpack/development.js +++ b/config/webpack/development.js @@ -1,40 +1,14 @@ const environment = require('./environment') -const customRules = { - module: { - rules: [ - { - test: /\.jsx?$/, - exclude: /(node_modules)/, - enforce: 'pre', - loader: 'eslint-loader', - options: { - configFile: '.eslintrc' - } - }, - { - test: /\.jsx?|.es6?|.spec.js?$/, - exclude: /(node_modules)/, - use: [ - { - loader: 'babel-loader', - options: { - presets: ['es2015', 'react'], - plugins: ['transform-object-rest-spread', 'transform-class-properties', 'transform-es2015-destructuring'] - } - } - ] - }, - { - test: /(\.css|\.scss|\.sass)$/, - loader: 'style-loader!css-loader!sass-loader?modules&localIdentName=[name]---[local]---[hash:base64:5]' - }, - { - test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/, - loader: 'file-loader?name=assets/[name].[hash].[ext]' - } - ] +// Add Webpack custom configs here +environment.loaders.append('eslint', { + test: /\.jsx?$/, + exclude: /(node_modules)/, + enforce: 'pre', + loader: 'eslint-loader', + options: { + configFile: '.eslintrc' } -} +}) -module.exports = Object.assign({}, environment, customRules) +module.exports = environment.toWebpackConfig() diff --git a/config/webpack/environment.js b/config/webpack/environment.js index 9ea153f6cf..dd2201d2b0 100644 --- a/config/webpack/environment.js +++ b/config/webpack/environment.js @@ -1,3 +1,28 @@ const { environment } = require('@rails/webpacker') -module.exports = environment.toWebpackConfig() +// Add global webpack configs here + +const babelLoader = environment.loaders.get('babel') +babelLoader.test = /\.jsx?|.es6?|.spec.js?$/ + +environment.loaders.delete('css') +environment.loaders.delete('moduleCss') +environment.loaders.delete('sass') +environment.loaders.delete('moduleSass') + +environment.loaders.append('style', { + test: /(\.css|\.scss|\.sass)$/, + use: [ + { loader: 'style-loader' }, + { loader: 'css-loader' }, + { + loader: 'sass-loader', + options: { + modules: true, + localIdentName: '[name]---[local]---[hash:base64:5]' + } + } + ] +}) + +module.exports = environment diff --git a/config/webpack/production.js b/config/webpack/production.js index 1114faa4df..a574aa2d84 100644 --- a/config/webpack/production.js +++ b/config/webpack/production.js @@ -1,31 +1,5 @@ const environment = require('./environment') -const customRules = { - module: { - rules: [ - { - test: /\.jsx?|.es6?|.spec.js?$/, - exclude: /(node_modules)/, - use: [ - { - loader: 'babel-loader', - options: { - presets: ['es2015', 'react'], - plugins: ['transform-object-rest-spread', 'transform-class-properties', 'transform-es2015-destructuring'] - } - } - ] - }, - { - test: /(\.css|\.scss|\.sass)$/, - loader: 'style-loader!css-loader!sass-loader?modules&localIdentName=[name]---[local]---[hash:base64:5]' - }, - { - test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/, - loader: 'file-loader?name=assets/[name].[hash].[ext]' - } - ] - } -} +// Add Webpack custom configs here -module.exports = Object.assign({}, environment, customRules) +module.exports = environment.toWebpackConfig() diff --git a/config/webpack/test.js b/config/webpack/test.js index 1114faa4df..a574aa2d84 100644 --- a/config/webpack/test.js +++ b/config/webpack/test.js @@ -1,31 +1,5 @@ const environment = require('./environment') -const customRules = { - module: { - rules: [ - { - test: /\.jsx?|.es6?|.spec.js?$/, - exclude: /(node_modules)/, - use: [ - { - loader: 'babel-loader', - options: { - presets: ['es2015', 'react'], - plugins: ['transform-object-rest-spread', 'transform-class-properties', 'transform-es2015-destructuring'] - } - } - ] - }, - { - test: /(\.css|\.scss|\.sass)$/, - loader: 'style-loader!css-loader!sass-loader?modules&localIdentName=[name]---[local]---[hash:base64:5]' - }, - { - test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/, - loader: 'file-loader?name=assets/[name].[hash].[ext]' - } - ] - } -} +// Add Webpack custom configs here -module.exports = Object.assign({}, environment, customRules) +module.exports = environment.toWebpackConfig() From 42e9b17f3cf76f9cde96c166fddb4bf71a97fa59 Mon Sep 17 00:00:00 2001 From: Jose Miguel Gallas Date: Tue, 18 Dec 2018 15:35:09 +0100 Subject: [PATCH 2/3] [babel] adds all plugins in babelrc --- .babelrc | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/.babelrc b/.babelrc index 0b9660231c..6f669bad0e 100644 --- a/.babelrc +++ b/.babelrc @@ -1,5 +1,11 @@ { - "plugins": ["syntax-dynamic-import", "transform-runtime"], + "plugins": [ + "syntax-dynamic-import", + "transform-runtime", + "transform-object-rest-spread", + "transform-class-properties", + "transform-es2015-destructuring" + ], "presets": [ "es2015", "react", @@ -12,7 +18,11 @@ ] }, "test": { - "presets": ["es2015", "react", "stage-0"] + "presets": [ + "es2015", + "react", + "stage-0" + ] } } -} +} \ No newline at end of file From c73acfb1a3fef9489c4e4b86fae65a94775bb662 Mon Sep 17 00:00:00 2001 From: Jose Miguel Gallas Date: Wed, 19 Dec 2018 15:26:47 +0100 Subject: [PATCH 3/3] [webpack] removes support from es6 files --- config/webpack/environment.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/config/webpack/environment.js b/config/webpack/environment.js index dd2201d2b0..b39bb7fd86 100644 --- a/config/webpack/environment.js +++ b/config/webpack/environment.js @@ -3,7 +3,7 @@ const { environment } = require('@rails/webpacker') // Add global webpack configs here const babelLoader = environment.loaders.get('babel') -babelLoader.test = /\.jsx?|.es6?|.spec.js?$/ +babelLoader.test = /\.jsx?|.spec.js?$/ environment.loaders.delete('css') environment.loaders.delete('moduleCss')