chore(*): upgrade to webpack2

topheman/rxjs-experiments@5cb9658
topheman · Jun 18, 2017 · 8eeb35f · 8eeb35f
1 parent 8153b2d
commit 8eeb35f
Show file tree

Hide file tree

Showing 5 changed files with 685 additions and 110 deletions.
diff --git a/.babelrc b/.babelrc
@@ -1,10 +1,17 @@
 {
-  "presets": ["es2015", "react"],
-  "plugins": ["transform-class-properties", "transform-es2015-destructuring", "transform-object-rest-spread", "add-module-exports"],
   "env": {
+    "production": {
+      "presets": ["es2015", "react"],
+      "plugins": ["transform-class-properties", "transform-es2015-destructuring", "transform-object-rest-spread", "add-module-exports"]
+    },
+    "test": {
+      "presets": ["es2015", "react"],
+      "plugins": ["transform-class-properties", "transform-es2015-destructuring", "transform-object-rest-spread", "add-module-exports"]
+    },
     // only enable it when process.env.NODE_ENV is 'development' or undefined
     "development": {
-      "presets": ["react-hmre"]
+      "presets": ["es2015", "react", "react-hmre"],
+      "plugins": ["transform-class-properties", "transform-es2015-destructuring", "transform-object-rest-spread", "add-module-exports"]
     }
   }
 }
diff --git a/common.js b/common.js
@@ -10,7 +10,7 @@ function getInfos() {
   const pkg = require('./package.json');
   const infos = {
     pkg: pkg,
-    today: moment(new Date()).format('DD/MM/YYYY'),
+    today: moment(new Date()).format(),
     year: new Date().toISOString().substr(0, 4),
     gitRevisionShort: gitActive ? gitRev.short() : null,
     gitRevisionLong: gitActive ? gitRev.long() : null,

diff --git a/package.json b/package.json
@@ -52,7 +52,7 @@
     "eslint-loader": "^1.3.0",
     "eslint-plugin-react": "^3.16.1",
     "eslint-watch": "^2.1.4",
-    "extract-text-webpack-plugin": "^1.0.1",
+    "extract-text-webpack-plugin": "^2.1.2",
     "file-loader": "^0.8.4",
     "git-rev-sync": "^1.4.0",
     "html-webpack-plugin": "^2.9.0",
@@ -67,9 +67,9 @@
     "sass-loader": "^3.1.2",
     "serve": "^1.4.0",
     "style-loader": "^0.13.0",
-    "url-loader": "^0.5.7",
-    "webpack": "^1.12.14",
-    "webpack-dev-server": "^1.14.1"
+    "url-loader": "^0.5.9",
+    "webpack": "^2.6.1",
+    "webpack-dev-server": "^2.4.5"
   },
   "dependencies": {
     "array-includes": "^3.0.2",

diff --git a/webpack.config.js b/webpack.config.js
@@ -54,14 +54,11 @@ if (!OPTIMIZE) {
 if (FAIL_ON_ERROR) {
   log.info('webpack', 'NoErrorsPlugin disabled, build will fail on error');
 }
-if (OPTIMIZE) {
-  log.info('webpack', 'OPTIMIZE: code will be compressed and deduped');
-}
 
 /** plugins setup */
 
 if(!FAIL_ON_ERROR) {
-  plugins.push(new webpack.NoErrorsPlugin());
+  plugins.push(new webpack.NoEmitOnErrorsPlugin());
 }
 
 plugins.push(new HtmlWebpackPlugin({
@@ -73,10 +70,12 @@ plugins.push(new HtmlWebpackPlugin({
   BANNER_HTML: BANNER_HTML
 }));
 // extract css into one main.css file
-plugins.push(new ExtractTextPlugin(`main${hash}.css`, {
+const extractSass = new ExtractTextPlugin({
+  filename: `main${hash}.css`,
   disable: false,
   allChunks: true
-}));
+});
+plugins.push(extractSass);
 plugins.push(new webpack.BannerPlugin(BANNER));
 plugins.push(new webpack.DefinePlugin({
   // Lots of library source code (like React) are based on process.env.NODE_ENV
@@ -91,14 +90,20 @@ plugins.push(new webpack.DefinePlugin({
 }));
 
 if (OPTIMIZE) {
-  plugins.push(new webpack.optimize.DedupePlugin());
   plugins.push(new webpack.optimize.UglifyJsPlugin({
     compress: {
       warnings: true
     }
   }));
 }
 
+if (NODE_ENV !== 'production') {
+  // to keep compatibility with old loaders - debug: true was previously on config
+  plugins.push(new webpack.LoaderOptionsPlugin({
+    debug: true
+  }));
+}
+
 if (MODE_DEV_SERVER) {
   // webpack-dev-server mode
   if(LOCALHOST) {
@@ -132,7 +137,8 @@ if (LINTER) {
   preLoaders.push({
     test: /\.js$/,
     exclude: /node_modules/,
-    loader: 'eslint-loader'
+    loader: 'eslint-loader',
+    enforce: 'pre'
   });
 }
 else {
@@ -151,17 +157,16 @@ const config = {
     publicPath: '',
     filename: `[name]${hash}.js`,
     chunkFilename: `[id]${hash}.chunk.js`,
-    path: BUILD_DIR + '/' + DIST_DIR
+    path: path.join(__dirname, BUILD_DIR, DIST_DIR)
   },
   cache: true,
-  debug: NODE_ENV === 'production' ? false : true,
   devtool: OPTIMIZE ? false : 'sourcemap',
   devServer: {
     host: LOCALHOST ? 'localhost' : myLocalIp()
   },
   module: {
-    preLoaders: preLoaders,
-    loaders: [
+    rules: [
+      ...preLoaders,
       {
         test: /\.js$/,
         exclude: /node_modules/,
@@ -173,22 +178,29 @@ const config = {
       },
       {
         test: /\.scss$/,
-        loader: ExtractTextPlugin.extract('style-loader',
-          'css-loader?sourceMap!sass-loader?sourceMap=true&sourceMapContents=true&outputStyle=expanded&' +
-          'includePaths[]=' + (path.resolve(__dirname, './node_modules'))
-        )
-      },
-      {
-        test: /\.css$/,
-        loader: 'style-loader!css-loader'
+        use: extractSass.extract({
+          use: [{
+            loader: "css-loader",
+            query: JSON.stringify({
+              sourceMap: true
+            })
+          }, {
+            loader: "sass-loader",
+            query: JSON.stringify({
+              sourceMap: true
+            })
+          }],
+          // use style-loader in development
+          fallback: "style-loader"
+        })
       },
-      { test: /\.csv$/, loader: 'file?&name=assets/[hash].[ext]' },
+      { test: /\.csv$/, loader: 'file-loader?&name=assets/[hash].[ext]' },
       { test: /\.(png)$/, loader: 'url-loader?limit=' + ASSETS_LIMIT + '&name=assets/[hash].[ext]' },
-      { test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=' + ASSETS_LIMIT + '&mimetype=application/font-woff&name=assets/[hash].[ext]' },
-      { test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=' + ASSETS_LIMIT + '&mimetype=application/font-woff&name=assets/[hash].[ext]' },
-      { test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=' + ASSETS_LIMIT + '&mimetype=application/octet-stream&name=assets/[hash].[ext]' },
-      { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: 'file?&name=assets/[hash].[ext]' },
-      { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=' + ASSETS_LIMIT + '&mimetype=image/svg+xml&&name=assets/[hash].[ext]' }
+      { test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, loader: 'url-loader?limit=' + ASSETS_LIMIT + '&mimetype=application/font-woff&name=assets/[hash].[ext]' },
+      { test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, loader: 'url-loader?limit=' + ASSETS_LIMIT + '&mimetype=application/font-woff&name=assets/[hash].[ext]' },
+      { test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: 'url-loader?limit=' + ASSETS_LIMIT + '&mimetype=application/octet-stream&name=assets/[hash].[ext]' },
+      { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: 'file-loader?&name=assets/[hash].[ext]' },
+      { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'url-loader?limit=' + ASSETS_LIMIT + '&mimetype=image/svg+xml&&name=assets/[hash].[ext]' }
     ]
   },
   plugins: plugins,