解决方案:
package.json文件的script的analyze命令:
"analyze": "ANALYZE=1 umi build"
修改为:
"analyze": "cross-env ANALYZE=1 umi build"
完整代码:
"scripts": {
"start": "umi dev",
"analyze": "cross-env ANALYZE=1 umi build"
},
注意:如果报错找不到cross-env命令,则安装cross-env即可。
启用analyze的步骤如下:
1.在根目录下的packag.json,添加analyze命令:
2.(此步骤可忽略)如果项目是定义了配置文件,也就是根目录下config文件夹的config.ts(或者js)文件,没有则在.umirc.ts文件,在配置文件中添加analyze的配置属性:
analyze: {
analyzerMode: 'server',
analyzerPort: 8888,
openAnalyzer: true,
generateStatsFile: false,
statsFilename: 'stats.json',
logLevel: 'info',
// parsed是我们关注的层级,其余两个运行后也可查看
defaultSizes: 'parsed', // stat // gzip
},
3.在终端运行命令,运行完毕后会自动打开性能分析页面,或者手动访问http://localhost:8888(如果配置analyze时配置了端口analyzerPort,就要修改端口为配置的端口)
//npm
npm run analyze
//yarn
yarn analyze