這篇文章主要介紹了Vue項目報錯:Uncaught SyntaxError: Unexpected token <,在引入第三方依賴的 JS 文件時,遇到的一個問題,小編覺得挺不錯的,現在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧 遇到問題: 今天做一個 VUE 的項目,在引入第三方依賴的 ...
這篇文章主要介紹了Vue項目報錯:Uncaught SyntaxError: Unexpected token <,在引入第三方依賴的 JS 文件時,遇到的一個問題,小編覺得挺不錯的,現在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
遇到問題:
今天做一個 VUE 的項目,在引入第三方依賴的 JS 文件時,遇到了一個問題:
控制台的提示:Uncaught SyntaxError: Unexpected token <
按照提示進入文件,再看如下圖:
仔細看了看 index.html 文件,發現原本我的 JS 文件是放在 /src/utils 文件夾下的,但引入 /src 和 /static 的文件是有區別的。
解決方案:
解決辦法是將第三方依賴的 JS 文件放到 /static/utils 目錄下,引入路徑也改成:<script src="./static/utils/sockjs.js"></script>,這樣就不報錯了!
總結:
1、assets文件夾與static文件夾的區別
區別一:assets文件是src下的,所以最後運行時需要進行打包,而static文件不需要打包就直接放在最終的文件中了
區別二:assets中的文件在vue中的template/style下用../這種相對路徑的形式進行引用,在script下必須用@import的方式引入而static下的文件在.vue中的任何地方都只要使用../這種相對路徑的方式引入,
2、
(1)assets用來放置樣式、靜態圖片,只要src下麵的組件中用到的資源就放在assets中。
(2)static用來放沒有npm包的第三方插件,字體文件。
(3)assets與components同級 components下的.vue引用靜態文件時,相對路徑為 ../assets/wapFront
3、vue如何引入其它靜態文件:
(1)src目錄下的資源只能import或require。
(2)想靜態引入的話,建立一個與src同級的目錄例如static,然後把靜態資源放入該文件夾下,html的引入路徑如下:./static/...(註:試過一定要放在static文件夾下,否則報錯)
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
原文地址:http://www.manongjc.com/article/17978.html