分析打包的大小

Source map explorer 使用源映射分析 JavaScript 包。这有助于你了解代码膨胀的来源。

¥Source map explorer analyzes JavaScript bundles using the source maps. This helps you understand where code bloat is coming from.

要将 Source map explorer 添加到 Create React App 项目，请执行以下步骤：

¥To add Source map explorer to a Create React App project, follow these steps:

npm install --save source-map-explorer

或者你可以使用 yarn：

¥Alternatively you may use yarn:

yarn add source-map-explorer

然后在 package.json 中，在 scripts 中添加以下行：

¥Then in package.json, add the following line to scripts:

   "scripts": {
+    "analyze": "source-map-explorer 'build/static/js/*.js'",
     "start": "react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test",

然后分析打包，即运行生产构建然后运行分析脚本。

¥Then to analyze the bundle run the production build then run the analyze script.

npm run build
npm run analyze