解决:autoprefixer.js? Module "source-map-js" has been externalized for browser

145 阅读1分钟

解决办法

出现这个错误的原因是你的 vue 组件里面有一行:

import { data } from "autoprefixer";

把这个删除就行了。

错误关键点

在谷歌浏览器中,看你是报错的位置是否有

image.png

如果不在谷歌浏览器中可能没有,比如 IE 浏览器中是这样的:

image-1.png

总结原因

我自己是在写 vue 组件的时候在 defineProps 的时候,写入父组件传进来的属性 data,但是没有用东西接收,然后直接在 script 标签代码里面使用了 data(其实是不能使用的),想着打印一下这个 data 的值,vscode 自动提示了一个 data,我就直接 tab 键引入,没有看清楚这个不预期 import,导致报错。

其实如果修复了 data 的使用就是用一个 props 来接收,没有把上面那个 import 删掉的话,即使没有用这个 data,项目是能够正常运行,但是浏览器还是会报警告。因为当 vue 组件里面有这个 import 时,会导致 autoprefixer.js 文件被 external 化,进而导致报错。

总之下次小心一点这个地方,对于 tab 键引入的的值,看看是否有不预期的 import