我想分析我的 Next.js 构建源地图浏览器 https://www.npmjs.com/package/source-map-explorer。有人可以帮我编写脚本吗？
对于 React (CRA)，我使用以下脚本：
"build:analyze": "npm run build && source-map-explorer 'build/static/js/*.js'",
npm run build:analyze
是否有类似的方法来分析内部构建.next还有？
UPDATE
.next/文件结构:
.next
├── BUILD_ID
├── build-manifest.json
├── cache
│ └── webpack
│ ├── client-production
│ │ ├── 0.pack
│ │ └── index.pack
│ └── server-production
│ ├── 0.pack
│ └── index.pack
├── export-marker.json
├── images-manifest.json
├── prerender-manifest.json
├── react-loadable-manifest.json
├── required-server-files.json
├── routes-manifest.json
├── server
│ ├── chunks
│ │ ├── 129.js
│ │ ├── 398.js
│ │ ├── 50.js
│ │ ├── 649.js
│ │ ├── 664.js
│ │ ├── 690.js
│ │ ├── 803.js
│ │ ├── 825.js
│ │ └── 859.js
│ ├── font-manifest.json
│ ├── pages
│ │ ├── 404.js
│ │ ├── 500.html
│ │ ├── _app.js
│ │ ├── _document.js
│ │ ├── _error.js
│ │ ├── api
│ │ │ └── get-config.js
│ │ ├── auth
│ │ │ ├── login-error.js
│ │ │ ├── login-success.js
│ │ │ └── vendor-repair.js
│ │ ├── help.js
│ │ ├── home.js
│ │ ├── index.js
│ │ ├── onboarding.js
│ │ ├── photo-gallery-details.js
│ │ ├── photo-gallery.js
│ │ ├── popup.js
│ │ ├── practise.js
│ │ ├── privacy-policy.js
│ │ ├── profile.js
│ │ ├── reference-documents.js
│ │ ├── repair-details.js
│ │ ├── repair-request.js
│ │ ├── stage-area.js
│ │ ├── store-comments.js
│ │ ├── store-visit-checklist.js
│ │ ├── store-visit-history.js
│ │ ├── visual-merchandise-details.js
│ │ └── visual-merchandise.js
│ ├── pages-manifest.json
│ └── webpack-runtime.js
└── static
├── chunks
│ ├── 29107295-62449f6ab50432c0efef.js
│ ├── 475-f51e5d80bd683f3b5684.js
│ ├── 4a3ea9cd-27e375e040b0a04d492d.js
│ ├── 514-2f11410f8595f17ec257.js
│ ├── framework-c179ed8d0295df0a6019.js
│ ├── main-c9abfc3dcd7802a764ed.js
│ ├── pages
│ │ ├── 404-8481e9d7d36e8670eb39.js
│ │ ├── _app-eb5037c043313bbfb3fc.js
│ │ ├── _error-a33892d286e78bfa334d.js
│ │ ├── auth
│ │ │ ├── login-error-8141cf890a77a08b5fd7.js
│ │ │ ├── login-success-494df6631cb3f5141e9a.js
│ │ │ └── vendor-repair-bed782e18fed509b3903.js
│ │ ├── help-e318e021fc815ad4c48a.js
│ │ ├── home-c6c8b871ab5c5738665e.js
│ │ ├── index-bd34bcc4cc28f9419b8d.js
│ │ ├── onboarding-07120812010a84501867.js
│ │ ├── photo-gallery-details-f515c1b20e11f414190b.js
│ │ ├── photo-gallery-e3972e175274149dba6b.js
│ │ ├── popup-81f14fa216f8b1def307.js
│ │ ├── practise-2b8d378b633a9b426aab.js
│ │ ├── privacy-policy-5c65687e77deed0661a0.js
│ │ ├── profile-58058efb871cd14f8a2e.js
│ │ ├── reference-documents-6507fb50d903d9b6881e.js
│ │ ├── repair-details-e2e94513e20e98f7e274.js
│ │ ├── repair-request-26a0d3902ac752eafeab.js
│ │ ├── stage-area-64d34fda6a621eecdc1c.js
│ │ ├── store-comments-9dbd60b5353c708b220b.js
│ │ ├── store-visit-checklist-411682c351d799fe983a.js
│ │ ├── store-visit-history-224243943fdb8ae73663.js
│ │ ├── visual-merchandise-88be768dfe1fc5ada55f.js
│ │ └── visual-merchandise-details-c102d8d548e4757a72e6.js
│ ├── polyfills-7b08e4c67f4f1b892f4b.js
│ └── webpack-e5108aeecfc3e7f070df.js
├── css
│ ├── 03632b0eee83f601f359.css
│ └── f999bd706539c2e100c7.css
├── media
│ ├── Metropolis-Medium.251ab6a3f9cf79779269596ecbe28574.eot
│ ├── Metropolis-Medium.a8208f13e1711b160eabc04bafbd04d9.ttf
│ ├── Metropolis-Medium.bff42e1c5682f2689bdc8e47a3753b27.woff2
│ ├── Metropolis-Medium.f23d75633ae80143c0f4d819d6a0d323.woff
│ ├── Metropolis-Regular.360d0f5a8067816addd5a4da45aaa660.eot
│ ├── Metropolis-Regular.b54f45f08c62b81d0078de96bb920cd9.ttf
│ ├── Metropolis-Regular.cd75f7c84a6375cdee1928c936c13a20.woff
│ ├── Metropolis-Regular.e90dcb53335abcd72603e0718c6c8cd2.woff2
│ ├── Metropolis-SemiBold.03a3e314fb58e1b6fe4104e24dee09a7.woff
│ ├── Metropolis-SemiBold.1c6f27c0abbd4b2a94f84e21efc14265.eot
│ ├── Metropolis-SemiBold.3af64c0941a01fed6ea3e61028323897.woff2
│ ├── Metropolis-SemiBold.bdaa1ae71421dd75bb29537a78b2ed08.ttf
│ ├── ajax-loader.fb6f3c230cb846e25247dfaa1da94d8f.gif
│ ├── helveticaneue-bold.54da3e9e715c351fef284c8fe3d191d2.eot
│ ├── helveticaneue-bold.80c2aa2e5c685eae489425fd673346f0.woff
│ ├── helveticaneue-bold.b17142a9ee042ff5cfecce7bc12f3513.ttf
│ ├── helveticaneue-bold.b82ee7f1ae8568f0d6bae2b98b4bff46.svg
│ ├── helveticaneue-bold.f66775fae72ac8325a23028c5accda16.woff2
│ ├── helveticaneue-light.61226a60a0b5787be0fba7d142ee703d.woff2
│ ├── helveticaneue-light.6e3ec2feb1535ebf53e9f4d25dcfa94f.woff
│ ├── helveticaneue-light.d846f89ab1d295bd315d9c71167df502.svg
│ ├── helveticaneue-light.ddf262cb96782fefcbc8984c8131a471.eot
│ ├── helveticaneue-light.fb11a81f919945d13c73b549d4e7e1e1.ttf
│ ├── helveticaneue-medium.29744a2c2edcc640ecb99d2de05f9c2e.woff
│ ├── helveticaneue-medium.4a368f8dd72410bb7e6ffe37e91100c4.ttf
│ ├── helveticaneue-medium.54e305719b6cfc7db698fa584ea9e738.woff2
│ ├── helveticaneue-medium.8aca99ab7abac084902d2fcd8a68625e.svg
│ ├── helveticaneue-medium.bfaaa603f19e12a88d35305f96b4b25f.eot
│ ├── slick.2630a3e3eab21c607e21576571b95b9d.svg
│ ├── slick.295183786cd8a138986521d9f388a286.woff
│ ├── slick.a4e97f5a2a64f0ab132323fbeb33ae29.eot
│ └── slick.c94f7671dcc99dce43e22a89f486f7c2.ttf
└── pNP1560UJNYEPcr4n-2-U
├── _buildManifest.js
└── _ssgManifest.js
可用时间自Next.js 10.0.4 https://github.com/vercel/next.js/releases/tag/v10.0.4，您可以在您的生产版本中启用源映射生成next.config.js文件，因为默认情况下它是禁用的。
// next.config.js
module.exports = {
productionBrowserSourceMaps: true
}
然后，您可以修改 npm 脚本以定位到正确的文件夹.next目录。
"build:analyze": "npm run build && source-map-explorer .next/static/**/*.js"
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
