vue中index.html引用静态js

修改环境：vue-cli 2.x

index.html位置

默认在根目录下

也可通过以下方法修改

 

 

修改对应环境的template路径（初始为index.html）

修改为从根目录起，想要使用的index.html位置。

js的引用路径

从html相关联的js路径并不是相对路径，而是配置文件转换后的路径。

若如下配置，是找不到文件的

 

当他找不到文件时，会报出 Uncaught SyntaxError: Unexpected token '<'

 

是因为它把它找不到的文件替换成了index.html中的内容

 

正确的引用路径如下

 

首先确认config/index.js中assetsSubDirectory和assertsPublicPath的路径。

其中assetsSubDirectory为引用的静态资源的路径。这个并不是指你在script或者其它标签配置的路径会直接添加上前缀，而是指这个路径下的静态资源才会被读取。

assetsPublicPath为index.html里面引用资源的的相对地址。这个值不能随意更改。因为在编译vue时。对#app转为的app.js路径也会受到这个值影响，随意修改会导致vue读取不到

参考链接：https://blog.csdn.net/weixin_33920401/article/details/87962115

 

最后放一个正确读取到js的例子

index.js

 

webpack.dev.conf.js

 

index.html

 

test.js

 

效果