本篇文章主要介绍如何利用Charles 在本地调试vue线上项目

1、点击tools，选择Map Local Setting

2、在弹出的窗口上点击add进行添加配置

a:第一处填写线上项目打包好的项目根目录static文件夹

b:第二处选择正在开发的项目本地打包文件夹dist下的static

保存。

3、再点击Tools下Rewrite Setting

4、在打开的窗口上，勾选Enable Rewrite

然后分别点击右侧的Add进行配置

a:上方配置与设置Map Local Setting时保持一致即可

b:下方配置如下，选择URl，输入匹配规则保存即可

至此，配置完毕，本地每次打包之后，就可以在线上预览本地代码

注意：本地调试的时候打包的static内的文件需要文件名与后缀名之间的随机数去除，像下面这样

over。