long
2023-03-03 9860e221460a0a4ac1903dad2c97160d0eed0e63
提交 | 用户 | age
36e1de 1 'use strict'
L 2 const utils = require('./utils')
3 const webpack = require('webpack')
4 const config = require('../config')
5 const merge = require('webpack-merge')
6 const path = require('path')
7 const baseWebpackConfig = require('./webpack.base.conf')
8 const CopyWebpackPlugin = require('copy-webpack-plugin')
9 const HtmlWebpackPlugin = require('html-webpack-plugin')
10 const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
11 const portfinder = require('portfinder')
12
13 const HOST = process.env.HOST
14 const PORT = process.env.PORT && Number(process.env.PORT)
15
16 const devWebpackConfig = merge(baseWebpackConfig, {
17   module: {
18     rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })
19   },
20   // cheap-module-eval-source-map is faster for development
21   devtool: config.dev.devtool,
22
23   // these devServer options should be customized in /config/index.js
24   devServer: {
25     clientLogLevel: 'warning',
26     historyApiFallback: {
27       rewrites: [
28         { from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') },
29       ],
30     },
31     hot: true,
32     contentBase: false, // since we use CopyWebpackPlugin.
33     compress: true,
34     host: HOST || config.dev.host,
35     port: PORT || config.dev.port,
36     open: config.dev.autoOpenBrowser,
37     overlay: config.dev.errorOverlay
38       ? { warnings: false, errors: true }
39       : false,
40     publicPath: config.dev.assetsPublicPath,
41     proxy: config.dev.proxyTable,
42     quiet: true, // necessary for FriendlyErrorsPlugin
43     watchOptions: {
44       poll: config.dev.poll,
45     }
46   },
47   plugins: [
48     new webpack.DefinePlugin({
49       'process.env': require('../config/dev.env')
50     }),
51     new webpack.HotModuleReplacementPlugin(),
52     new webpack.NamedModulesPlugin(), // HMR shows correct file names in console on update.
53     new webpack.NoEmitOnErrorsPlugin(),
54     // https://github.com/ampedandwired/html-webpack-plugin
55     new HtmlWebpackPlugin({
56       filename: 'index.html',
57       template: 'index.html',
58       inject: true
59     }),
60     // copy custom static assets
61     new CopyWebpackPlugin([
62       {
63         from: path.resolve(__dirname, '../static'),
64         to: config.dev.assetsSubDirectory,
65         ignore: ['.*']
66       }
67     ])
68   ]
69 })
70
71 module.exports = new Promise((resolve, reject) => {
72   portfinder.basePort = process.env.PORT || config.dev.port
73   portfinder.getPort((err, port) => {
74     if (err) {
75       reject(err)
76     } else {
77       // publish the new Port, necessary for e2e tests
78       process.env.PORT = port
79       // add port to devServer config
80       devWebpackConfig.devServer.port = port
81
82       // Add FriendlyErrorsPlugin
83       devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({
84         compilationSuccessInfo: {
85           messages: [`Your application is running here: http://${devWebpackConfig.devServer.host}:${port}`],
86         },
87         onErrors: config.dev.notifyOnErrors
88         ? utils.createNotifierCallback()
89         : undefined
90       }))
91
92       resolve(devWebpackConfig)
93     }
94   })
95 })