本文针对Vue小白，不喜勿喷，谢谢

这个问题的迹象如下

控制台警告(资源解释为样式表，但以mime类型文本/html传输)

原因及解决办法

第一个可能的原因是引入的静态文件在src文件夹中。这个解决方案是将资源引入静态资源的静态目录

第二个可能的原因是有一个单独的静态资源目录，但它的名称不是静态的。这个解决方案改变了配置文件，将几个对应配置文件中的静态改为自己创建的静态资源目录。因为大部分在线教程都没有完全改，这个问题还是会出现，所以这也是今天写这篇文章的原因。

需要更改的文件有三个，分别是config文件夹下的index.js，build文件夹下的webpack.dev.conf.js和webpack.prod.conf.js

如果您的静态资源文件夹被称为public，与src文件夹处于同一级别，您需要对其进行如下修改

1.index.js

Dev: {Assets子目录：' public '，//原来是静态的，现在改为public Assets public path : `/$ { name }/`，build : { index : path . resolve(_ _ dirname，'./dist/index.html ')，assetroot : path . resolve(_ _ dirname '，/dist ')，Assets子目录：' public '，//原来是静态的，现在改为public2.webpack.dev.conf.js。

//复制自定义静态资产新的copy webpackplugin([{//下面原来是静态的，现在从：path.resolve (_ _ dirname，)./public ')，to : config . build . assets子目录，ignore: [。*'] } ])3.webpack.prod.conf.js

//复制自定义静态资产新建copy webpackplugin([{//原来下面是静态的，现在从：path改成了public。resolve (_ _ dirname '，/public ')，转到：config.dev.assets子目录，ignore3360 [。*']}])

以上就是vue将静态文件引入index.html效果不佳的问题及其解决方案。希望对大家有帮助。如果你有任何问题，请给我留言，边肖会及时回复你。非常感谢您对我们网站的支持！如果你觉得这篇文章对你有帮助，请转载，请注明出处，谢谢！