1 |
|
2 |
|
3 | const fs = require('fs')
|
4 | const errorOverlayMiddleware = require('react-dev-utils/errorOverlayMiddleware')
|
5 | const evalSourceMapMiddleware = require('react-dev-utils/evalSourceMapMiddleware')
|
6 | const noopServiceWorkerMiddleware = require('react-dev-utils/noopServiceWorkerMiddleware')
|
7 | const ignoredFiles = require('react-dev-utils/ignoredFiles')
|
8 | const { rootPath } = require('../lib/utils')
|
9 | const paths = require('../config/paths')
|
10 |
|
11 | module.exports = function({ entry, proxy, protocol, publicPath = '/', host }) {
|
12 | const localPublicDir = rootPath(`${paths.views}/${entry}/public`)
|
13 |
|
14 | return {
|
15 | // 允许修改 host 模拟跨域
|
16 | disableHostCheck: true,
|
17 | headers: { 'Access-Control-Allow-Origin': '*' },
|
18 | // Enable gzip compression of generated files.
|
19 | compress: true,
|
20 | // 屏蔽 WebpackDevServer 自身的日志输出
|
21 | // 此设置不影响警告与错误信息
|
22 | clientLogLevel: 'silent',
|
23 | // https://github.com/webpack/webpack-dev-server/pull/2235
|
24 | // 由于 WDS #2235 改动,强制指定 logLevel 为 silent,
|
25 | // quiet 保持缺省,避免 WDS 打印初始化信息
|
26 | // quiet: true,
|
27 | logLevel: 'silent',
|
28 | // 注意,不要通过 webpack import public 内的资源
|
29 | // 对于脚本及样式,应使用 script,link 标签引入
|
30 | // <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
|
31 | // 在 js 内,可使用 process.env.PUBLIC_URL 获取路径
|
32 | contentBase: [
|
33 | // 全局 public
|
34 | paths.public,
|
35 | // 页面级 public
|
36 | localPublicDir
|
37 | // @FIXME 监听 html 文件变化,临时措施
|
38 | // `${paths.views}/${entry}/*.html`
|
39 | ],
|
40 | // By default files from `contentBase` will not trigger a page reload.
|
41 | watchContentBase: true,
|
42 | // Enable hot reloading server. It will provide /sockjs-node/ endpoint
|
43 | // for the WebpackDevServer client so it can learn when the files were
|
44 | // updated. The WebpackDevServer client is included as an entry point
|
45 | // in the Webpack development configuration. Note that only changes
|
46 | // to CSS are currently hot reloaded. JS changes will refresh the browser.
|
47 | hot: true,
|
48 | // It is important to tell WebpackDevServer to use the same "root" path
|
49 | // as we specified in the config. In development, we always serve from /.
|
50 | publicPath: publicPath,
|
51 | // Reportedly, this avoids CPU overload on some systems.
|
52 | // https://github.com/facebook/create-react-app/issues/293
|
53 | // src/node_modules is not ignored to support absolute imports
|
54 | // https://github.com/facebook/create-react-app/issues/1065
|
55 | watchOptions: {
|
56 | ignored: ignoredFiles(paths.src)
|
57 | },
|
58 | // Enable HTTPS if the HTTPS environment variable is set to 'true'
|
59 | https: protocol === 'https',
|
60 | host: host,
|
61 | overlay: false,
|
62 | historyApiFallback: {
|
63 | // Paths with dots should still use the history fallback.
|
64 | // See https://github.com/facebook/create-react-app/issues/387.
|
65 | disableDotRule: true
|
66 | },
|
67 | // proxy,
|
68 | before(app, server) {
|
69 | if (fs.existsSync(paths.proxySetup)) {
|
70 | // This registers user provided middleware for proxy reasons
|
71 | require(paths.proxySetup)(app)
|
72 | }
|
73 |
|
74 | // This lets us fetch source contents from webpack for the error overlay
|
75 | app.use(evalSourceMapMiddleware(server))
|
76 | // This lets us open files from the runtime error overlay.
|
77 | app.use(errorOverlayMiddleware())
|
78 |
|
79 | // This service worker file is effectively a 'no-op' that will reset any
|
80 | // previous service worker registered for the same host:port combination.
|
81 | // We do this in development to avoid hitting the production cache if
|
82 | // it used the same host and port.
|
83 | // https://github.com/facebook/create-react-app/issues/2272#issuecomment-302832432
|
84 | app.use(noopServiceWorkerMiddleware())
|
85 | },
|
86 | open: false
|
87 | }
|
88 | }
|