Vue:一个项目中如何引用自己在static目录下写的js文件

最新推荐文章于 2024-04-03 12:15:32 发布
最新推荐文章于 2024-04-03 12:15:32 发布
阅读量2.9k 收藏 2
点赞数 1
文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_46093203/article/details/123414655
版权

本人创建了一个vue项目，自己在static文件夹下写了一个js脚本文件，开始使用import { GVerify } from '../static/verifcode.js'，出现报错。
在这里插入图片描述
后来经过调试正确的引用格式是
在这里插入图片描述

曾经的逍遥少年
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue项目报错：Uncaught SyntaxError: Unexpected token
01-19
遇到问题： 今天做一个 VUE 的项目，在引入第三方依赖的 JS 文件时，遇到了一个问题： 控制台的提示：Uncaught SyntaxError: Unexpected token < 按照提示进入文件，再看如下图： 仔细看了看 index.html 文件,发现原本我的 JS 文件是放在 /src/utils 文件夹下的，但引入 /src 和 /static 的文件是有区别的。 解决方案： 解决办法是将第三方依赖的 JS 文件放到 /static/utils 目录下，引入路径也改成：[removed][removed]，这样就
vue 项目中引入本地静态的js
m0_49016709的博客
12-06 3830
在index.html中引入本地的js 首先把你需要引入的js文件放在static文件夹下，我在statics文件夹下新建passW。 在index.html中引入passW下的jq文件，一下是代码 <script src=<%= BASE_URL %>/passW/jquery-2.1.4.min.js></script> 这里的<%= BASE_URL %>是在webpack 配置中使 webpack.definePlugin 这个内置 webpack
VUE 爬坑之旅 -- 引入静态资源的正确方式，总结一下
最新发布
m0_60453176的博客
04-03 719
世界上只有一种真正的英雄主义就是在认清生活真相之后仍然热爱它。
vue 项目引用static目录资源_vue中 静态文件引用注意事项
weixin_39848953的博客
12-21 9762
(一)assets文件夹与static文件夹的区别区别一：assets文件是src下的，所以最后运行时需要进行打包，而static文件不需要打包就直接放在最终的文件中了区别二：assets中的文件在vue中的template/style下用../这种相对路径的形式进行引用，在script下必须用@import的方式引入，而static下的文件在.vue中的任何地方都只要使用../这种相对路径的方式...
vue打包静态资源后显示空白及static文件路径报错的解决
11-19
今天使用vue打包（npm run build）遇到了几个坑，在这里分享给大家 打包之后打开dist的页面显示空白： 这个问题以前就处理过，是打包过程中出现错误频率较高的一种，可能有3处地方会出现这种情况 1、记得改一下config下面的index.js中bulid模块导出的路径。因为打包后的index.html里边的内容都是通过script标签引入的，默认显示的路径不对，打开肯定是空白的。 build: { index: path.resolve(__dirname, '../dist/index.html'), assetsRoot: path.resolve(__dirname
vue在index.html中引入静态文件不生效问题及解决方法
11-28
本文针对的是Vue小白，不喜勿喷，谢谢 出现该问题的标志如下 控制台warning（Resource interpreted as Stylesheet but transferred with MIME type text/html） 出现的原因及解决办法 第一种可能出现原因就是引入的静态文件在src文件夹内，这种的解决办法就是把资源引入静态资源的目录static 第二种可能出现的原因就是有单独的静态资源目录但是名字不叫static，这种的解决办法更改配置文件，把对应的几个配置文件内的static更改为你自己所创建的静态资源目录，由于网上大多教程所改的地方都不够完全，还是会出现该问题，
vue引入静态js文件的方法
10-15
主要介绍了vue引入静态js文件的方法,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
vue 如何引入静态js资源，例如jquery之类的
PrimaryColor
07-19 7443
步骤一、存放js文件。 静态js文件一般是存放在public目录下，为了结构明确，可以新建一个js文件夹，专门存放js文件，然后把需要引入的js文件放在该目录下，如图。 步骤二、引入js。 引入js文件必须在public下的index.html文件引入。示范： <script type="text/javascript" src="<%= BASE_URL %>js/jquery.3.2.1.min.js"></script> 其中“<%= BAS.
vue2.0/vue3.0 添加静态文件
lp-Strive的博客
08-26 6473
vue，静态文件static，静态文件public
vue引入静态js文件
高先生的猫
06-18 5901
由于一些演示，需要对编码名称等可快速进行修改，需要页面方便配置。由于build后的vue项目基本已经看不出原样，因此需要创建一个文件，并在打包的时候不会进行编译。 vue-cli 2.0的作法是在static文件下创建js。vue-cli 3.0 的写法则是直接在public文件夹下创建js、 具体操作如下： 1、在public文件夹下创建config.js文件，里面文件的语法是es5，不允许使用浏览器不能兼容的es6语法。因为该文件不进行编译，es6部分语法浏览器不兼容。 2.、在html文件下，
vue 引入外部js静态文件
且听风吟的博客
12-31 2874
在一个组件内部需要引入一个js文件，如果放在index.html，每个组件都会有这个js，所以需要在组件内单独引入。 下载静态文件下来后，放入文件夹： 组件代码： <template> <div> <button @click="compressImage">点击调用方法</button> </div> </template> <script> import ImageCompressor from '@/
如何配置vue.config.js 处理static文件夹下的静态文件
01-19
最近开发过程中遇到个小需求，需要根据需求动态配置一些静态数据，但我不想直接把这个静态文件引入进来，build时就会把数据打包到js文件中，造成js文件很大；呃呃。。。。（ps:就想给自己找点别扭） 回头看一下项目，果断的在根目录下创建一个static/test.json文件,在目标页面下fetch获取这个json文件里的数据： fetch(../static/test.json) .then(res => res.json()) .then(res => { //获取到了数据 }) .catch(err=>{ //解析错误或者获取数据失败 }) ok，就这么简单，完活了运行起来看看效果
Vue-cli项目获取本地json文件数据的实例
11-29
通过查阅，我发现，在vue-cli基础上构建的项目中，只有static目录才是vue-cli向外暴露的静态数据文件夹，我放在static下的图片可以正常访问到，我是在static同级目录新建了datas目录，将json文件放入datas目录，请求...
vue中引入静态第三方js文件，解决Uncaught SyntaxError: Unexpected token ‘＜‘
一条咸鱼的blog
10-21 5515
今天在vue项目里集成静态js文件，知道大体思路是将js文件放到项目里的某个位置，然后在index.html中用script标签引入js文件，因为index.html是整个vue项目的一个访问入口，所以在这里引入的js可以全局使用。但是在集成的过程中依然遇到了一些问题。 先说下在vue-cli3.0以上版本中集成的正确方式： 1.将js文件放入public文件夹下 2.在index.html中引入js文件 这样就可以直接在vue中使用静态js了。 尝试过程与遇到的问题： js文件放在src/assets
vue 配置static文件夹下的静态文件
REal_201903的博客
09-01 1359
vue静态文件配置
Vue2 组件局部引用静态js、css文件
u013025181的博客
05-05 2598
vue2在组件中引入外部的静态js、css，可指定加载顺序
vue 引入需要复用的静态js文件
a378113472的博客
06-04 696
1.在static 中创建js文件 2.js 文件中写入需要复用的对象 后导出 const obj1 = { a : 1, b:2 } export default obj1; 3main.js 中引入 并且挂载到Vue 的原型上 4.组件中引入需要复用的对象 别的生命周期也能拿到，随意使用 updated() { console.log(this.obj1,55555) }, ...
Vue3引用static文件夹中的文件，需要使用同名文件夹名称存放在public内
qq_29517595的博客
10-10 216
vite+Vue3引用static文件夹中的文件，需要使用同名文件夹名称存放在public内
vue静态资源的引用(相对路径,绝对路径,@,~的一些笔记,以图片引入为例,含在线演示)
热门推荐
动感超人的博客
08-21 1万+
vue引入静态资源有相对路径和绝对路径的方式相对路径是URL开头有.绝对路径是URL开头为/或者省略不写相对路径相对的是当前文件绝对路径相对的是public目录并且引入的时候URL开头为~的使用在css里面引入静态资源的时候如果 URL 以 @ 开头会作为一个模块请求被解析。Vue CLI 默认会设置一个指向 src 的别名 @。
vue引入static目录下的文件
06-07
在Vue项目中，可以通过在模板中使用相对路径引入static目录下的文件。例如，如果要引入static目录下的一张图片，可以在模板中这样写： ```html <img src="../static/image.png" alt="图片"> ``` 其中，`../`表示返回上一级目录，然后再进入static目录，找到对应的文件。 如果需要在JS代码中引入static目录下的文件，可以使用相对路径或者绝对路径。例如，使用相对路径引入static目录下的一个JSON文件： ```js import data from '../static/data.json' ``` 或者使用绝对路径引入static目录下的一个CSS文件： ```js import '@/static/style.css' ``` 其中，`@`表示项目根目录，也就是src目录。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值