src_js/iconolab-bundle/webpack.config.js
changeset 541 4aa4664b0343
parent 539 08e2513dbc2f
--- a/src_js/iconolab-bundle/webpack.config.js	Thu Jun 07 01:05:30 2018 +0200
+++ b/src_js/iconolab-bundle/webpack.config.js	Thu Jun 07 15:12:09 2018 +0200
@@ -1,39 +1,12 @@
 const path = require('path')
 const webpack = require('webpack')
-const ExtractTextPlugin = require('extract-text-webpack-plugin')
 const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
 const projectRoot = path.resolve(__dirname)
 const VueLoaderPlugin = require('vue-loader/lib/plugin')
 const LodashModuleReplacementPlugin = require('lodash-webpack-plugin')
 const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
-
-const cssLoaders = [{
-  loader: 'css-loader',
-  options: {
-    module: true,
-    localIdentName: '[local]'
-  }
-}]
-
-const scssLoaders = [
-  {
-    loader: 'css-loader',
-    options: {
-      module: true,
-      localIdentName: '[local]',
-      importLoaders: 1
-    }
-  },
-  {
-    loader: 'resolve-url-loader'
-  },
-  {
-    loader: 'postcss-loader'
-  },
-  {
-    loader: 'sass-loader'
-  }
-]
+const MiniCssExtractPlugin = require('mini-css-extract-plugin')
+const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin')
 
 module.exports = {
   entry: {
@@ -58,10 +31,15 @@
     },
     {
       test: /\.css$/,
-      loader: ExtractTextPlugin.extract({
-        fallback: 'style-loader',
-        use: cssLoaders
-      }),
+      use: [{
+        loader: MiniCssExtractPlugin.loader
+      }, {
+        loader: 'css-loader',
+        options: {
+          module: true,
+          localIdentName: '[local]'
+        }
+      }],
       include: [
         path.join(__dirname, '/src'),
         /node_modules/
@@ -69,10 +47,25 @@
     },
     {
       test: /\.scss$/,
-      loader: ExtractTextPlugin.extract({
-        fallback: 'style-loader',
-        use: scssLoaders
-      }),
+      use: [{
+        loader: MiniCssExtractPlugin.loader
+      }, {
+        loader: 'css-loader',
+        options: {
+          module: true,
+          localIdentName: '[local]',
+          importLoaders: 1
+        }
+      },
+      {
+        loader: 'resolve-url-loader'
+      },
+      {
+        loader: 'postcss-loader'
+      },
+      {
+        loader: 'sass-loader'
+      }],
       include: [
         path.join(__dirname, '/src'),
         /node_modules/
@@ -123,22 +116,28 @@
         loader: 'expose-loader',
         options: 'Vue'
       }]
+    },
+    {
+      test: require.resolve('lodash/core'),
+      use: [{
+        loader: 'expose-loader',
+        options: '_'
+      }]
     }
     ]},
   plugins: [
-    new ExtractTextPlugin('iconolab/css/[name].css'),
+    new MiniCssExtractPlugin({ filename: 'iconolab/css/[name].css' }),
     new VueLoaderPlugin(),
     new webpack.ProvidePlugin({
       $: 'jquery',
-      jQuery: 'jquery',
-      Popper: ['popper.js', 'default']
+      jQuery: 'jquery'
     }),
     new LodashModuleReplacementPlugin(),
     new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /fr/)
   ],
   devServer: {
     port: 8001,
-    contentBase: path.join(__dirname, '/../../src/iconolab'),
+    contentBase: '.',
     publicPath: '/static/',
     stats: 'minimal',
     compress: true,
@@ -167,7 +166,8 @@
           ecma: 6
         },
         sourceMap: true
-      })
+      }),
+      new OptimizeCSSAssetsPlugin({})
     ]
   }
 }
@@ -183,9 +183,11 @@
       }
     })
   ])
-} else {
+} else if (process.env.NODE_ENV === 'bundlesize') {
   module.exports.mode = 'development'
   module.exports.plugins = (module.exports.plugins || []).concat([
     new BundleAnalyzerPlugin()
   ])
+} else {
+  module.exports.mode = 'development'
 }