本次施工react版本為"react": "^16.13.1",
yarn eject
后
先在public
文件中增加所需html文件:
進入config/paths.js
查找appHtml
及appIndexJs
字段添加以下內(nèi)容:
src文件結(jié)構(gòu)如下:
進入config/webpack.config.js
施工部分如下:
4
5
6
7
8
運行
yarn build
如果出現(xiàn)了Cannot read property 'filter' of undefined
報錯
解決辦法如下:
在config/webpack.config.js
文件下找到ManifestPlugin
函數(shù)俯抖,注釋掉generate
參數(shù)或者取消entrypoints
這個值的傳遞
ManifestPlugin
這個插件的作用是生成一份.json
的文件折联,通過該文件的映射關(guān)系可以讓我們知道webpack是如何追蹤所有模塊并映射到輸出bundle
中的
//config/webpack.config.js
new ManifestPlugin({
fileName: 'asset-manifest.json',
publicPath: paths.publicUrlOrPath,
// generate: (seed, files, entrypoints) => {
// const manifestFiles = files.reduce((manifest, file) => {
// manifest[file.name] = file.path;
// return manifest;
// }, seed);
// const entrypointFiles = entrypoints.main.filter(
// fileName => !fileName.endsWith('.map')
// );
// return {
// files: manifestFiles,
// entrypoints: entrypointFiles,
// };
// },
}),