vue引用/下载public目录下文件的方式

最新推荐文章于 2024-03-23 11:22:11 发布
最新推荐文章于 2024-03-23 11:22:11 发布
阅读量3.6k 收藏 3
点赞数 1
分类专栏： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xiao1215fei/article/details/117567207
版权

如需要下载public下的excel模板文件

window.location.href = process.env.BASE_URL + 'template/数据模板.xlsx'

其中template是public目录下的子文件夹。

如果不加前面的process.env.BASE_URL，发布到生产环境后，会出现找不到资源的情况。

垃圾侠
关注
  • 1
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue@cli3项目模板怎么使用public目录下的静态文件
10-15
主要介绍了vue@cli3项目模板怎么使用public目录下的静态文件，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
vue2，vue3 访问/使用public下的文件
Dzb1993的博客
08-04 5093
直接使用 “/文件名” 即可 / 默认代表public文件夹
vue 下载public目录的公共文件提示“网站无法提取文件”或者下载下来文件打开是空白
最新发布
qq_41643226的博客
03-23 535
vue 前端项目，通过a标签下载文件，如果vue.config.js中配置了publicPath，需要在下载的文件地址前面加上配置的路径前缀。
vue3 访问 public 内文件
weixin_46243213的博客
10-07 4529
vue3 访问 public 内文件
如何配置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引入静态js文件的方法
01-19
由于一些演示，需要对编码名称等可快速进行修改，需要页面方便配置。由于build后的vue项目基本已经看不出原样，因此需要创建一个文件，并在打包的时候不会进行编译。 vue-cli 2.0的作法是在static文件下创建js。vue-cli 3.0 的写法则是直接在public文件夹下创建js、 具体操作如下： 1、在public文件夹下创建config.js文件，里面文件的语法是es5，不允许使用浏览器不能兼容的es6语法。因为该文件不进行编译，es6部分语法浏览器不兼容。 2.、在html文件下，使用<scrtipt>标签进入 3、在页面直接按照原生的方法使用即可。 例如config.js定
vue3 静态资源加载
m0_50080847的博客
02-09 399
如 public 有image logo.png 引入时： src=‘/image/logo.png’将静态资源放到 public 文件下 引入的时候以 ’ / ’ 代替。
vue前端获取项目下的静态资源文件夹中的文件并下载
我的博客
04-07 3298
前端项目/public/static/image文件夹下。项目中获取这两张图片。
vue项目下载项目本地文件
前端菜鸡的博客
11-12 2130
将文件放置 public 文件夹下，在需要下载直接 window.location = '/+文件名'; eg: 我文件直接放置在public文件夹下的根目录，文件名为student_list window.location = '/student_list.xlsx';
vue封装下载方法，实现下载功能，下载excel，文件等（利用a标签实现下载）
Sept_16R的博客
09-05 447
【代码】vue封装下载方法，实现下载功能，下载excel，文件等（利用a标签实现下载）
vue项目下载excel方法(.xlsx文件)以及导出
weixin_60885570的博客
07-10 2575
代码中发送请求接口。
vue在index.html中引入静态文件不生效问题及解决方法
11-28
本文针对的是Vue小白，不喜勿喷，谢谢 出现该问题的标志如下 控制台warning（Resource interpreted as Stylesheet but transferred with MIME type text/html） 出现的原因及解决办法 第一种可能出现原因就是引入的静态文件在src文件夹内，这种的解决办法就是把资源引入静态资源的目录static 第二种可能出现的原因就是有单独的静态资源目录但是名字不叫static，这种的解决办法更改配置文件，把对应的几个配置文件内的static更改为你自己所创建的静态资源目录，由于网上大多教程所改的地方都不够完全，还是会出现该问题，
vue 引入公共css文件的简单方法(推荐)
08-28
下面小编就为大家分享一篇vue 引入公共css文件的简单方法(推荐)，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue项目下载public目录下的文件
九段刀客的博客
02-09 2257
click_down_excel() { let dom = document.createElement("a"); dom.href = "/static/importExcel/material.xlsx"; dom.download = "material.xlsx"; document.body.appendChild(dom); // 点击下载 dom.click(); document.body.remove.
vue 下载本地文件
热门推荐
yorcentroll的博客
04-29 1万+
情景描述： 有时，我们需在在前端项目中下载本地某个地址的文件模块，这个文件不想放在后端去下载。所以，在这个文件大小不是太大的情况下，我们可以把文件放在前端项目目录中，这样不管开发环境还是生产环境，都能在同样的路径下找到那个文件。 实现： 1. 先得把文件放在项目工程目录下的某个路径下，这个路径不管是开发环境还是打包之后在生产环境，都是一样的。在vue-cli 3.x+的版本中，这个文件...
vue中文件的下载
hyy4668的博客
07-22 652
下载前端静态资源 1.将需要下载的资源放在public中 2.在需要下载的组件A中，加入如下内容 <template> <div> <a :href="url('/用户管理-批量导入模板.xlsx')" download="用户管理-批量导入模板.xlsx"> <Button type="error">下载模板</Button> </a> </div> </template&g.
VUE获取文件夹下的文件并引入
m0_37901492的博客
02-10 2792
VUE获取文件夹下的文件并引入
VUE读取execl文件
Jw_1201的博客
02-01 1545
VUE读取execl文件 实现页面预览数据
VUE读取本地execl文件
老张的便利贴
08-11 870
一、环境需要 需要xlsx包，安装方法： npm install xlsx --save 一个execl文件，并且放到vue项目的public目录下。 二、代码 新建一个.vue <template> <div> <el-button @click="beforeUpload()">加载数据</el-button> </div> </template> <script> import axios from 'axios
vue3.2 引用public下的js文件
09-07
在Vue 3.2中，引用public下的js文件的方法有两种。 第一种方法是直接在index.html文件中使用`<script>`标签引入js文件。首先确保public文件夹下有需要引入的js文件，然后在index.html文件中的`<head>`标签内添加如下代码： ``` <head> ... <script src="<文件路径/文件名.js>"></script> ... </head> ``` 其中`<文件路径/文件名.js>`是指需要引入的js文件的路径和文件名。 第二种方法是使用import语句引入js文件。首先在src文件夹下创建一个新的js文件，例如`public.js`，然后在该文件中使用import语句引入需要使用的js文件。示例如下： ``` // public.js import '<文件路径/文件名.js>'; ``` 其中`<文件路径/文件名.js>`是指需要引入的js文件的路径和文件名。 然后，在需要使用该js文件的组件中使用import语句引入`public.js`文件。示例如下： ``` // HelloWorld.vue <script> import '@/public.js'; export default { ... } </script> ``` 在上述代码中，`@/public.js`表示public.js文件的路径相对于当前组件的路径。 这样就可以在Vue 3.2中成功引用public下的js文件了。无论是使用第一种方法还是第二种方法，都能实现引入js文件并在Vue组件中使用。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值