前言:你可以試試清除緩存這種最直接的方法 說(shuō)不定就解決了 如果解決不了在參看以下步驟
問(wèn)題:在vue項(xiàng)目中引入靜態(tài)資源,放在public文件夾里使用絕對(duì)路徑
本地運(yùn)行是沒(méi)問(wèn)題的,打包后發(fā)布到正式環(huán)境卻報(bào)此錯(cuò)誤 Uncaught SyntaxError: Unexpected token ‘<‘
問(wèn)題方向:這樣的問(wèn)題一般都是我們?cè)诖虬笠氲?span style="color: rgb(254, 44, 36);">資源路徑出錯(cuò)的問(wèn)題
解決方法:我們可以在URL路徑前面加上一個(gè)公共的路徑,即我們的打包配置中publicpath的前綴 <%= BASE_URL %>
或者:只要把這里的 publicPath 設(shè)置為 "/" 就行,前面不要加點(diǎn),改了之后問(wèn)題就解決了。
提示:其實(shí)系統(tǒng)默認(rèn)就是‘/’,只是部署的時(shí)候看到別人的文章都說(shuō)需要改,就加了個(gè)’.’上去,后來(lái)發(fā)現(xiàn)其實(shí)不改就可以了,改了反而會(huì)報(bào)錯(cuò),最新版的vue在部署的時(shí)候已經(jīng)不需要修改默認(rèn)的路徑了。
1、public 目錄提供的是一個(gè)應(yīng)急手段,當(dāng)通過(guò)絕對(duì)路徑引用時(shí),需要留意應(yīng)用會(huì)部署到哪里。如果沒(méi)有部署在域名的根部,需要為你的 URL 配置 publicPath 前綴:
<script src="/js/xx.js"></script>
由于項(xiàng)目正式環(huán)境沒(méi)有部署在域名的根部
,所以需要在URL中配置publicPath 前綴
<script src="<%= BASE_URL %>js/xx.js"></script>
在vue.config.js中聲明,正式環(huán)境前綴需帶上“/demo”,那么這里的BASE_URL
就相當(dāng)于/demo
publicPath: process.env.NODE_ENV === "production" ? "/demo" : "/",
2、static 目錄,與src同級(jí),一般存放第三方文件,不會(huì)被 webpack 解析,會(huì)直接被復(fù)制到最終的打包目錄(默認(rèn)是 dist/static )下,必須使用絕對(duì)路徑引用,這些文件是不會(huì)變動(dòng)的。
3、assets目錄,在編譯過(guò)程中會(huì)被 webpack 處理,當(dāng)做模塊依賴,只支持相對(duì)路徑的形式。一般放置可能會(huì)變動(dòng)的文件。
注:public 與 static的區(qū)別在于:static是vue2.x以下版本的,vue2.x以上的就換成public目錄了