SHARE
TWEET

Untitled

a guest Jan 24th, 2019 72 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. const webpack = require('webpack');
  2. const HtmlWebPackPlugin = require('html-webpack-plugin');
  3. const MiniCssExtractPlugin = require('mini-css-extract-plugin');
  4. const ProgressBarPlugin = require('progress-bar-webpack-plugin');
  5.  
  6. const path = require('path');
  7. const argvs = require('yargs').argv;
  8. const devMode = process.env.WEBPACK_SERVE || argvs.mode === 'development';
  9.  
  10. const DEFAULT_PORT = 8080;
  11. const host = process.env.MONACA_SERVER_HOST || argvs.host || '0.0.0.0';
  12. const port = argvs.port || DEFAULT_PORT;
  13. const wss = process.env.MONACA_TERMINAL ? true : false;
  14. const socketPort = port + 1; //it is used for webpack-hot-client
  15.  
  16. let webpackConfig = {
  17.   mode: devMode ? 'development' : 'production',
  18.   entry: {
  19.     app: ['./src/main.js']
  20.   },
  21.  
  22.   output: {
  23.     path: path.resolve(__dirname, 'www'),
  24.     filename: '[name].js'
  25.   },
  26.  
  27.   optimization: {
  28.     removeAvailableModules: true,
  29.     splitChunks: {
  30.       chunks: 'all'
  31.     },
  32.     runtimeChunk: true,
  33.     removeEmptyChunks: true,
  34.     providedExports: true
  35.   },
  36.  
  37.   resolve: {
  38.     extensions: ['.js', '.jsx', '.json', '.css', '.html', '.styl'],
  39.     modules: [path.resolve(__dirname, 'src'), 'node_modules']
  40.   },
  41.  
  42.   module: {
  43.     rules: [
  44.       {
  45.         test: /\.(js|jsx)$/,
  46.         exclude: /node_modules/,
  47.         include: path.resolve(__dirname, 'src'),
  48.         loader: 'babel-loader',
  49.         options: {
  50.           presets: [
  51.             'env',
  52.             'react',
  53.             'stage-2'
  54.           ]
  55.         }
  56.       },
  57.       {
  58.         test: /\.html$/,
  59.         use: [
  60.           {
  61.             loader: 'html-loader',
  62.             options: { minimize: true }
  63.           }
  64.         ]
  65.       },
  66.       {
  67.         test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)(\?\S*)?$/,
  68.         loader: 'file-loader?name=assets/[name].[hash].[ext]'
  69.       },
  70.       {
  71.         test: /\.css$/,
  72.         use: [
  73.           devMode ? 'style-loader' : MiniCssExtractPlugin.loader,
  74.           {
  75.             loader: 'css-loader',
  76.             options: { importLoaders: 1 }
  77.           },
  78.           {
  79.             loader: 'postcss-loader',
  80.             options: { sourceMap: true }
  81.           }
  82.         ]
  83.       }
  84.     ]
  85.   },
  86.  
  87.   plugins: [
  88.     new MiniCssExtractPlugin({
  89.       filename: '[name].css',
  90.       chunkFilename: '[name].css'
  91.     }),
  92.     new ProgressBarPlugin()
  93.   ],
  94.  
  95.   resolveLoader: {
  96.     modules: ['node_modules']
  97.   },
  98.  
  99.   performance: {
  100.     hints: false
  101.   }
  102. };
  103.  
  104. // Development mode
  105. if (devMode) {
  106.   webpackConfig.devtool = 'eval';
  107.  
  108.   webpackConfig.serve = {
  109.     port: port,
  110.     host: host,
  111.     devMiddleware: {
  112.       publicPath: '/',
  113.       stats: {
  114.         colors: true,
  115.         errorDetails: true,
  116.         performance: true,
  117.         source: true,
  118.         warnings: true,
  119.         builtAt: true
  120.       }
  121.     },
  122.     hotClient: {
  123.       port: socketPort,
  124.       https: wss
  125.     }
  126.   };
  127.  
  128.   let devPlugins = [
  129.     new HtmlWebPackPlugin({
  130.       template: 'src/public/index.html.ejs',
  131.       chunksSortMode: 'dependency'
  132.     })
  133.   ];
  134.  
  135.   webpackConfig.plugins = webpackConfig.plugins.concat(devPlugins);
  136. } else {
  137.   // Production mode
  138.   let prodPlugins = [
  139.     new HtmlWebPackPlugin({
  140.       template: 'src/public/index.html.ejs',
  141.       chunksSortMode: 'dependency',
  142.       externalCSS: ['components/loader.css'],
  143.       externalJS: ['components/loader.js'],
  144.       minify: {
  145.         caseSensitive: true,
  146.         collapseWhitespace: true,
  147.         conservativeCollapse: true,
  148.         removeAttributeQuotes: true,
  149.         removeComments: true
  150.       }
  151.     })
  152.   ];
  153.   webpackConfig.plugins = webpackConfig.plugins.concat(prodPlugins);
  154. }
  155.  
  156. module.exports = webpackConfig;
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!
 
Top