阿西河

所有教程

公众号
🌙
阿西河前端的公众号

我的收藏

    最近访问  (文章)

      教程列表

      抓包专区
      测试专区

      create-react-app 使用source-map-explorer分析 Build 后打包的资源情况

      Source map explorer 使用源地图分析JavaScript包。

      这可以帮助您了解代码臃肿的来源,比如你经常发现打包后的代码文件比较大,但是有不知道该从哪点来分析,那么就可以用这个 Source map explorer 了。

      要将 Source map explorer 添加到 Create React App 项目中,请遵循以下步骤:

      npm install --save source-map-explorer
      

      或者,您可以使用 yarn:

      yarn add source-map-explorer
      

      然后在中package.json,将以下行添加到scripts

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

      然后要分析捆绑软件,请运行 build,然后运行分析脚本。

      npm run build
      npm run analyze
      
      目录
      本文目录
      目录