Fixed project webpack config (#1606)

geosolutions-it · Mar 17, 2017 · d5b0429 · d5b0429
1 parent d5ef1d7
commit d5b0429
Show file tree

Hide file tree

Showing 3 changed files with 102 additions and 20 deletions.
diff --git a/project/prod-webpack.config.js b/project/prod-webpack.config.js
@@ -4,10 +4,24 @@ var LoaderOptionsPlugin = require("webpack/lib/LoaderOptionsPlugin");
 var ParallelUglifyPlugin = require("webpack-parallel-uglify-plugin");
 var DefinePlugin = require("webpack/lib/DefinePlugin");
 var NormalModuleReplacementPlugin = require("webpack/lib/NormalModuleReplacementPlugin");
+const extractThemesPlugin = require('./MapStore2/themes.js').extractThemesPlugin;
+var assign = require('object-assign');
+var CopyWebpackPlugin = require('copy-webpack-plugin');
 
 webpackConfig.plugins = [
+    new CopyWebpackPlugin([
+        { from: path.join(__dirname, 'node_modules', 'bootstrap', 'less'), to: path.join(__dirname, "web", "client", "dist", "bootstrap", "less") }
+    ]),
     new LoaderOptionsPlugin({
-        debug: false
+        debug: false,
+        options: {
+            postcss: {
+                plugins: [
+                  require('postcss-prefix-selector')({prefix: '.__PROJECTNAME__', exclude: ['.__PROJECTNAME__']})
+                ]
+            },
+            context: __dirname
+        }
     }),
     new DefinePlugin({
         "__DEVTOOLS__": false
@@ -27,7 +41,8 @@ webpackConfig.plugins = [
             compress: {warnings: false},
             mangle: true
         }
-    })
+    }),
+    extractThemesPlugin
 ];
 webpackConfig.devtool = undefined;
 

diff --git a/project/webpack.config.js b/project/webpack.config.js
@@ -3,21 +3,36 @@ var DefinePlugin = require("webpack/lib/DefinePlugin");
 var LoaderOptionsPlugin = require("webpack/lib/LoaderOptionsPlugin");
 var NormalModuleReplacementPlugin = require("webpack/lib/NormalModuleReplacementPlugin");
 var NoEmitOnErrorsPlugin = require("webpack/lib/NoEmitOnErrorsPlugin");
+var CopyWebpackPlugin = require('copy-webpack-plugin');
 
+const assign = require('object-assign');
+const themeEntries = require('./MapStore2/themes.js').themeEntries;
+const extractThemesPlugin = require('./MapStore2/themes.js').extractThemesPlugin;
 module.exports = {
-    entry: {
+    entry: assign({
         'webpack-dev-server': 'webpack-dev-server/client?http://0.0.0.0:8081', // WebpackDevServer host and port
         'webpack': 'webpack/hot/only-dev-server', // "only" prevents reload on syntax errors
         '__PROJECTNAME__': path.join(__dirname, "js", "app")
-    },
+    }, themeEntries),
     output: {
         path: path.join(__dirname, "dist"),
         publicPath: "/dist/",
         filename: "[name].js"
     },
     plugins: [
+        new CopyWebpackPlugin([
+            { from: path.join(__dirname, 'node_modules', 'bootstrap', 'less'), to: path.join(__dirname, "web", "client", "dist", "bootstrap", "less") }
+        ]),
         new LoaderOptionsPlugin({
-            debug: true
+            debug: true,
+            options: {
+                postcss: {
+                    plugins: [
+                      require('postcss-prefix-selector')({prefix: '.__PROJECTNAME__', exclude: ['.__PROJECTNAME__']})
+                    ]
+                },
+                context: __dirname
+            }
         }),
         new DefinePlugin({
             "__DEVTOOLS__": true
@@ -26,27 +41,84 @@ module.exports = {
         new NormalModuleReplacementPlugin(/openlayers$/, path.join(__dirname, "MapStore2", "web", "client", "libs", "openlayers")),
         new NormalModuleReplacementPlugin(/cesium$/, path.join(__dirname, "MapStore2", "web", "client", "libs", "cesium")),
         new NormalModuleReplacementPlugin(/proj4$/, path.join(__dirname, "MapStore2", "web", "client", "libs", "proj4")),
-        new NoEmitOnErrorsPlugin()
+        new NoEmitOnErrorsPlugin(),
+        extractThemesPlugin
     ],
     resolve: {
       extensions: [".js", ".jsx"]
     },
     module: {
-        loaders: [
-            { test: /\.css$/, loader: 'style-loader!css-loader'},
-            { test: /\.less$/, loader: "style-loader!css-loader!less-loader" },
-            { test: /\.woff(2)?(\?v=[0-9].[0-9].[0-9])?$/, loader: "url-loader?mimetype=application/font-woff" },
-            { test: /\.(ttf|eot|svg)(\?v=[0-9].[0-9].[0-9])?$/, loader: "file-loader?name=[name].[ext]" },
-            { test: /\.(png|jpg|gif)$/, loader: 'url-loader?name=[path][name].[ext]&limit=8192'}, // inline base64 URLs for <=8k images, direct URLs for the rest
+		noParse: [/html2canvas/],
+        rules: [
+            {
+                test: /\.css$/,
+                use: [{
+                    loader: 'style-loader'
+                }, {
+                    loader: 'css-loader'
+                }, {
+                  loader: 'postcss-loader'
+                }]
+            },
+            {
+                test: /\.less$/,
+                exclude: /themes[\\\/]?.+\.less$/,
+                use: [{
+                    loader: 'style-loader'
+                }, {
+                    loader: 'css-loader'
+                }, {
+                    loader: 'less-loader'
+                }]
+            },
+            {
+                test: /themes[\\\/]?.+\.less$/,
+                use: extractThemesPlugin.extract({
+                        fallback: 'style-loader',
+                        use: ['css-loader', 'postcss-loader', 'less-loader']
+                    })
+            },
+            {
+                test: /\.woff(2)?(\?v=[0-9].[0-9].[0-9])?$/,
+                use: [{
+                    loader: 'url-loader',
+                    options: {
+                        mimetype: "application/font-woff"
+                    }
+                }]
+            },
+            {
+                test: /\.(ttf|eot|svg)(\?v=[0-9].[0-9].[0-9])?$/,
+                use: [{
+                    loader: 'file-loader',
+                    options: {
+                        name: "[name].[ext]"
+                    }
+                }]
+            },
+            {
+                test: /\.(png|jpg|gif)$/,
+                use: [{
+                    loader: 'url-loader',
+                    options: {
+                        name: "[path][name].[ext]",
+                        limit: 8192
+                    }
+                }] 
+            }, 
             {
                 test: /\.jsx?$/,
                 exclude: /(ol\.js)$|(Cesium\.js)$|(cesium\.js)$/,
-                loader: "react-hot-loader",
+                use: [{
+                    loader: "react-hot-loader"
+                }],
                 include: [path.join(__dirname, "js"), path.join(__dirname, "MapStore2", "web", "client")]
             }, {
                 test: /\.jsx?$/,
                 exclude: /(ol\.js)$|(Cesium\.js)$/,
-                loader: "babel-loader",
+                use: [{
+                    loader: "babel-loader"
+                }],
                 include: [path.join(__dirname, "js"), path.join(__dirname, "MapStore2", "web", "client")]
             }
         ]

diff --git a/webpack.config.js b/webpack.config.js
@@ -13,12 +13,7 @@ module.exports = {
         'webpack-dev-server': 'webpack-dev-server/client?http://0.0.0.0:8081', // WebpackDevServer host and port
         'webpack': 'webpack/hot/only-dev-server', // "only" prevents reload on syntax errors
         "mapstore2": path.join(__dirname, "web", "client", "product", "app")
-    }, themeEntries
-     /* {
-         "themes/default": path.join(__dirname, "web", "client", "themes", "default", "theme.less"),
-         "themes/dark": path.join(__dirname, "web", "client", "themes", "dark", "theme.less")
-     }*/
-    ),
+    }, themeEntries),
     output: {
       path: path.join(__dirname, "web", "client", "dist"),
         publicPath: "/dist/",