Skip to main content

smart-debug（不推荐）

caution

因侵入源码因此不再推荐使用，推荐通过 Chrome 插件比如 山海关 代理实现。

用于 debug 调试，常见于线上环境加载本地 assets 资源进行调试的场景：

  • 开启调试后，可以指定页面加载本地 assets 资源

Install#

$ npm i -save-dev build-plugin-smart-debug

Usage#

{
"plugins": ["build-plugin-smart-debug"]
}

访问链接中开启 debug 调试，设置 smartDebug=true 进行开启

http://example.com/?smartDebug=true

开启后页面将默认加载本地入口脚本 127.0.0.1:3333/build/js/index.js，__webpack_public_path__ 将会变为 127.0.0.1:3333/build/。

默认加载的脚本地址，将会受 build.json 中的 outputDir 和 outputAssetPath.js 配置影响，即默认入口文件路径规则 ${outputDir}/${outputAssetPath.js}/index.js。 对应入口 css 文件的规则为 ${outputDir}/${outputAssetPath.css}/index.css，build-plugin-smart-debug 插件会自动通过 js 路径按规则替换并推导出 css 路径地址并进行自动加载。

支持定制的参数包括：

  • 调试端口：debugPort，例如设置调试 8080 端口，debugPort=8080，默认端口为：3333
  • 入口脚本路径：debugPath，debugPath=/build/index.js，页面将加载 127.0.0.1:8080/build/index.js
  • 资源输出路径：outputPath，outputPath=dist，即 runtime 的 publicPath 将会变成 127.0.0.1:8080/dist/，outputPath 默认读取 build.json 中的 outputDir，如果不需要可以设置为 outputPath=

如想加载的入口地址为 127.0.0.1:8080/dist/index.js， __webpack_public_path__路径为 127.0.0.1:8080/dist/，则可以在 url 中进行如下设置：

http://example.com/?smartDebug=true&debugPort=8080&debugPath=/dist/index.js&outputPath=dist
Edit this page