build successful but doesn't work

config/webpack.common.js

@@ -140,8 +140,34 @@ module.exports = (options) => {
 
     devtool: options.devtool,
     target: 'web', // Make web variables accessible to webpack, e.g. window
+    optimization: {
+      namedModules: true,
+      splitChunks: {
+        cacheGroups: {
+          commons: {
+            test: /resource/,
+            chunks: 'initial',
+            name: 'commons',
+            minChunks: 2,
+            minSize: 1,
+            priority: 20
+          },
+          vendors: {
+            test: /node_modules/,
+            chunks: (chunk) => {
+              return chunk.name !== 'legacy-presentation';
+            },
+            name: 'vendors',
+            // minChunks: 2,
+            minSize: 1,
+            priority: 10,
+            enforce: true
+          }
+        }
+      },
+      minimizer: options.optimization.minimizer || [],
+    },
     performance: options.performance || {},
-    optimization: options.optimization || {},
     stats: options.stats || {},
   };
 };

config/webpack.dev.js

@@ -9,13 +9,13 @@ const helpers = require('./helpers');
 /*
  * Webpack Plugins
  */
+const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 
-
-/*
- * Webpack configuration
- *
- * See: http://webpack.github.io/docs/configuration.html#cli
+/**
+ * Webpack Constants
  */
+const ANALYZE = process.env.ANALYZE;
+
 module.exports = require('./webpack.common')({
   mode: 'development',
   devtool: 'cheap-module-eval-source-map',
@@ -54,9 +54,14 @@ module.exports = require('./webpack.common')({
       manifest: path.join(helpers.root('public/dll'), 'manifest.json')
     }),
 
+    new BundleAnalyzerPlugin({
+      analyzerMode: ANALYZE ? 'server' : 'disabled',
+    }),
+
     new webpack.HotModuleReplacementPlugin(),
 
   ],
+  optimization: {},
   performance: {
     hints: false
   }

config/webpack.dll.js

@@ -9,7 +9,13 @@ const helpers = require('./helpers');
 module.exports = {
   mode: 'development',
   entry: {
-    dlls: ['react', 'react-dom']
+    dlls: [
+      'react', 'react-dom', 'react-bootstrap', 'react-bootstrap-typeahead', 'react-i18next',
+      'codemirror', 'react-codemirror2', 'react-dropzone',
+      'jquery-slimscroll', 'jquery-ui',
+      'markdown-it',
+      'diff2html', 'lodash', 'i18next',
+    ]
   },
   output: {
     path: helpers.root('public/dll'),

config/webpack.prod.js

@@ -58,7 +58,6 @@ module.exports = require('./webpack.common')({
 
   ],
   optimization: {
-    namedModules: true,
     minimizer: [
       new UglifyJsPlugin({
         cache: true,
@@ -66,21 +65,5 @@ module.exports = require('./webpack.common')({
       }),
       new OptimizeCSSAssetsPlugin({})
     ],
-    splitChunks: {
-      cacheGroups: {
-        commons: {
-          chunks: 'initial',
-          minChunks: 2,
-          minSize: 1,
-        },
-        vendor: {
-          test: /node_modules/,
-          chunks: 'initial',
-          name: 'vendor',
-          priority: 10,
-          enforce: true
-        }
-      }
-    }
   },
 });

lib/views/layout/layout.html

@@ -63,7 +63,7 @@ gh/highlightjs/cdn-release@9.12.0/build/languages/yaml.min.js
   {% endif %}
 
   {% if env === 'development' %}
-    <script src="/dll/vendor.dll.js"></script>
+    <script src="/dll/dll.js"></script>
     <script src="{{ webpack_asset('dev.js') }}" async></script>
     <!-- Browsersync -->
     <script id="__bs_script__">//<![CDATA[
@@ -71,7 +71,8 @@ gh/highlightjs/cdn-release@9.12.0/build/languages/yaml.min.js
     //]]></script>
   {% endif %}
 
-  <script src="{{ webpack_asset('vendor.js') }}" defer></script>
+  <script src="{{ webpack_asset('vendors.js') }}" defer></script>
+  <script src="{{ webpack_asset('commons.js') }}" defer></script>
   {% if isEnabledPlugins() %}
   <script src="{{ webpack_asset('plugin.js') }}" defer></script>
   {% endif %}

lib/views/page_presentation.html

@@ -35,19 +35,18 @@ gh/highlightjs/cdn-release@9.12.0/build/languages/yaml.min.js
 " defer></script>
 
     {% if env === 'development' %}
-      <script src="/dll/vendor.dll.js"></script>
-      <script src="{{ webpack_asset('dev').js }}" async></script>
+      <script src="/dll/dll.js"></script>
+      <script src="{{ webpack_asset('dev.js') }}" async></script>
     {% endif %}
 
-    <script src="{{ webpack_asset('commons').js }}" defer></script>
-    <script src="{{ webpack_asset('legacy-presentation').js }}" defer></script>
+    <script src="{{ webpack_asset('legacy-presentation.js') }}" defer></script>
 
     <title>{{ path|path2name }} | {{ path }}</title>
 
     <!-- styles -->
-    <link rel="stylesheet" href="{{ webpack_asset('style').css }}">
-    <link rel="stylesheet" href="{{ webpack_asset('style-theme-default').css }}">
-    <link rel="stylesheet" href="{{ webpack_asset('style-presentation').css }}">
+    <link rel="stylesheet" href="{{ webpack_asset('style.css') }}">
+    <link rel="stylesheet" href="{{ webpack_asset('style-theme-default.css') }}">
+    <link rel="stylesheet" href="{{ webpack_asset('style-presentation.css') }}">
 
     <!-- Google Fonts -->
     <link href='https://fonts.googleapis.com/css?family=Lato:400,700' rel='stylesheet' type='text/css'>

package.json

@@ -22,12 +22,12 @@
   "scripts": {
     "build:dev:analyze": "cross-env ANALYZE=1 npm run build:dev",
     "build:dev:app:watch": "npm run build:dev:app -- --watch",
-    "build:dev:app": "npm run clean:js && webpack --config config/webpack.dev.js --progress --profile",
-    "build:dev:watch": "npm-run-all -p build:dll build:dev:app:watch",
-    "build:dev": "npm-run-all -p build:dll build:dev:app",
+    "build:dev:app": "npm run clean:js && env-cmd config/env.dev.js webpack --config config/webpack.dev.js --progress --profile",
+    "build:dev:watch": "npm-run-all -s build:dll build:dev:app:watch",
+    "build:dev": "npm-run-all -s build:dll build:dev:app",
     "build:dll": "webpack --config config/webpack.dll.js",
     "build:prod:analyze": "cross-env ANALYZE=1 npm run build:prod",
-    "build:prod": "npm run clean && webpack --config config/webpack.prod.js --progress --profile --bail",
+    "build:prod": "npm run clean && env-cmd config/env.prod.js webpack --config config/webpack.prod.js --progress --profile --bail",
     "build": "npm run build:dev:watch",
     "clean:js": "rimraf -- public/js",
     "clean:dll": "rimraf -- public/dll",
@@ -101,9 +101,6 @@
     "passport": "^0.4.0",
     "passport-ldapauth": "^2.0.0",
     "passport-local": "^1.0.0",
-    "react": "^16.2.0",
-    "react-dom": "^16.2.0",
-    "react-i18next": "^7.6.1",
     "rimraf": "^2.6.1",
     "slack-node": "^0.1.8",
     "socket.io": "^2.0.3",
@@ -166,11 +163,14 @@
     "optimize-css-assets-webpack-plugin": "^4.0.2",
     "plantuml-encoder": "^1.2.5",
     "postcss-loader": "^2.1.3",
+    "react": "^16.2.0",
     "react-bootstrap": "^0.32.1",
     "react-bootstrap-typeahead": "^3.0.3",
     "react-clipboard.js": "^2.0.0",
     "react-codemirror2": "^5.0.0",
+    "react-dom": "^16.2.0",
     "react-dropzone": "^4.2.7",
+    "react-i18next": "^7.6.1",
     "reveal.js": "^3.5.0",
     "sass-loader": "^7.0.1",
     "simple-load-script": "^1.0.2",