vue如何引入js文件_vue中引入外部js好麻烦

vue如何引入js文件_vue中引入外部js好麻烦js文件一定要放在static下面,不可放在assets下面,因为assets下面的内容最终是要被打包的,而static下面的内容是不用打包直接放过去的;摘自:https://www.jb51.net/article/150517.htm遇到问题:今天做一个VUE的项目,在引入第三方依赖的JS文件时,遇到了一个问题:控制台的提示:UncaughtSyntaxError:Unexpectedtoken<按照提示进入文件,再看如下图:仔细看了看..

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

js文件一定要放在static下面,不可放在assets下面,因为assets下面的内容最终是要被打包的,而static下面的内容是不用打包直接放过去的;

 

 

摘自:https://www.jb51.net/article/150517.htm

遇到问题:

今天做一个 VUE 的项目,在引入第三方依赖的 JS 文件时,遇到了一个问题:

vue如何引入js文件_vue中引入外部js好麻烦

控制台的提示:Uncaught SyntaxError: Unexpected token <

按照提示进入文件,再看如下图:

vue如何引入js文件_vue中引入外部js好麻烦

仔细看了看 index.html 文件,发现原本我的 JS 文件是放在 /src/utils 文件夹下的,但引入 /src 和 /static 的文件是有区别的。

解决方案:

解决办法是将第三方依赖的 JS 文件放到 /static 目录下,引入路径也改成:<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文件夹下,否则报错)

 

在static文件中引入jQuery包之后,加入以上配置之后,再项目文件中使用’$’,发现还是会报错 —  eslint报错:’$’ is not defined 

解决:

  eslint认为没有声明,需要在eslintrc.js中加入globals配置

  globals: { 
    '$': false,
    'jquery': false
  }
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/184501.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • PYthon——plt.scatter各参数详解

    PYthon——plt.scatter各参数详解 最近开始学习Python编程,遇到scatter函数,感觉里面的参数不知道什么意思于是查资料,最后总结如下:1、scatter函数原型2、其中散点的形状参数marker如下:3、其中颜色参数c如下:4、基本的使用方法如下:[python] viewplain copy#导入必要的模块   import numpy as np   import mat…

    2022年6月29日
    79
  • 人体检测–热释电传感器开发

    人体检测–热释电传感器开发人体检测–热释电传感器开发人体热释电传感器顾名思义是探测是否有人体通行和通过,由于它的廉价性,使得它的应用范围非常广泛。楼道里的灯,天台的报警设施等,都是利用这个来进行报警和检测。本文章将分为两个板块来介绍传感器的开发和应用。一·热释电传感器的工作原理  某些晶体,例如钽酸锂、硫酸三甘肽等受热时,晶体两端会产生数量相等、符号相反的电荷。1842年布鲁斯特将这种由温度变化引起的电极化现象正式命名为…

    2022年9月1日
    0
  • 500-内部服务器错误_打开网页500错误怎么解决

    500-内部服务器错误_打开网页500错误怎么解决我win2003的操作系统,部署了asp网站到服务器上,但是,奇怪的是只能进入前台,每次进入后台都出现HTTP500-内部服务器错误真实郁闷坏了,用百度搜索了半天,大都是转载的千篇万律而且长篇大论的解决办法什么帐户密码不同步之类啊,误导我了呀,害我费劲了很大半天。没有想到,只是在一个小小的操作上就解决了。窃喜。一、启用Asp支持WindowsServer2003默认安

    2022年8月12日
    4
  • sqlpro studio激活(JetBrains全家桶)

    (sqlpro studio激活)好多小伙伴总是说激活码老是失效,太麻烦,关注/收藏全栈君太难教程,2021永久激活的方法等着你。https://javaforall.net/100143.htmlIntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,上面是详细链接哦~FNWCMR37AF-eyJsaWNlbnNlSWQiOi…

    2022年3月30日
    113
  • Codeforces Round #264 (Div. 2) C Gargari and Bishops 【暴力】

    Codeforces Round #264 (Div. 2) C Gargari and Bishops 【暴力】

    2022年1月15日
    50
  • 全局数据库名称.数据库名称.SID是什么关系?

    全局数据库名称.数据库名称.SID是什么关系?

    2022年2月24日
    43

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号