Loading... ## 克隆源码 1. `git clone https://github.com/vuejs/vue.git` 2. `yarn install` ## 环境 在vscode中安装几个插件: * live Server 用来开启一个服务预览网页 然后新建一个 `launch.json`的调试配置文件，内容可以如下： ``` { "name": "Launch Chrome", "request": "launch", "type": "pwa-chrome", "runtimeExecutable": "custom", // 这一部分是我pc上才需要加的 "url": "http://localhost:5500", // 这里的端口对应live server开启的端口 "webRoot": "${workspaceFolder}" } ``` ## 准备 1. 在 `package.json`的命令中添加 `-- sourcemap`: ``` "dev": "rollup -w -c scripts/config.js --environment TARGET:web-full-dev --sourcemap", ``` 2. 在 `example/tree/index.html`的 `script`引入的资源文件去掉 `.min` ## 开始 1. `npm run dev`此时会生成`sourcemap`文件 2. 使用`live server`预览，打开`http://localhost:5500/examples/tree/`就行了 此时已经有了映射关系，可以在 `chrome`或者 `vscode`上打断点都可以，如果要用 `vscode`打断点的话就需要点击 vscode的调试按钮。 最后修改：2021 年 08 月 17 日 09 : 20 PM © 允许规范转载 赞赏 如果觉得我的文章对你有用，请随意赞赏 赞赏作者