vue 引入静态json文件打包后文件内容未被修改

最新推荐文章于 2024-06-13 17:08:26 发布
最新推荐文章于 2024-06-13 17:08:26 发布
阅读量2.6k 收藏 7
点赞数
分类专栏： 前端bug 文章标签： javascript vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_36939346/article/details/106120388
版权

emmm...很坑，一开始就是单纯的引入json文件，发现打包后修改json文件但是并未更新，最后又换成了还使用axios引入，但是会有异步的问题一直解决不了。后来发现了个简单的办法。。

把json文件改成js，里面的放的还是json，然后index.html里面script引入，然后赋值给Vue.prototype全局直接使用

静态文件

index里面引入

然后要用的地方

Vue.prototype.$dict = window.dict
console.log(Vue.prototype.$dict.API_URL)

 

西鱼
关注
  • 0
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
专栏目录
vue完成项目后,打包成静态文件的方法
10-18
在项目开发完成后，通常需要将 Vue 项目打包成静态文件，以便部署到服务器上运行。这里我们将详细介绍如何使用 Vue CLI 工具来实现这一过程，以及如何利用 Node.js 进行本地调试。 首先，你需要确保已经安装了 Vue ...
vue打包之后更改配置的json文件无效
相濡以沫不如相望于江湖，是望着你不是忘了你。
08-16 3090
在project.config.json里面更改配置后不生效，具体原因还没有找到。然后把这个js文件引入到public/index.html下。在项目中就可以直接使用window.api进行使用。把json文件换成js文件。这是目前我找到的办法…...
vue技巧（十）全局配置使用（打包后可修改配置文件）
最新发布
Interest1_wyt的博客
06-13 987
vue js或json全局配置使用，打包后保持配置文件不变，支持打包后修改配置文件内容
vue 加载静态json文件打包后更换json内容不起作用
西鱼的博客
04-24 3762
之前是向下面直接把json文件引入，但是打包以后，调取的json文件还是未改之前的内容。所以找到了别的办法。 import api from '../../static/serverConfig.json' 然后找到了办法，引入了一个js 然后在要用的页面 import {$getJson} from './http' const getH5StaticJson = data =...
vue项目动态加载json文件，数据不更新
TRTR666的博客
12-22 1974
原本使用json文件是为了加载，不用重新打包，结果测试数据改变之后，没有加载更新； 解决办法： 1.将json文件改为js文件 内容 window.dict =(之前的 info.json 内容) 2.在main.js中引入 Vue.prototype.$dict = window.dict 3.在index.html中引入(注意：引入的时候要在body标签之上，不然会报错) <script src="./info.js"></script> 4.页面中使用 {{$dict.d
vue 封装print-js打印页面数据、页面样式
weixin_41931561的博客
06-17 4655
npm install print-js --save
在vue中读取本地Json文件的方法
10-18
在Vue.js应用中，有时我们需要从本地加载JSON文件来获取数据，这在开发阶段或处理静态数据时尤其有用。在本文中，我们将详细介绍如何在Vue中读取本地JSON文件。 首先，要实现这一功能，我们需要引入一个外部插件...
vue 打包后的文件部署到express服务器上的方法
08-29
要让Express服务器提供打包后的Vue应用，需在`app.js`中引入`path`模块，并使用`express.static()`中间件。将`dist`目录设置为静态资源目录，这样Express就能正确地服务Vue应用的静态文件。 5. **修改package.json...
如何配置vue.config.js 处理static文件夹下的静态文件
10-15
保存`vue.config.js`后，重新运行`npm run build`或`yarn build`，静态文件如`test.json`就会被正确地复制到构建输出目录，从而可以在运行时正常访问。 需要注意的是，这种方法适用于处理`static`文件夹中的所有...
解决vue-cli项目webpack打包后iconfont文件路径的问题
10-18
Webpack是一个模块打包工具，它能够将JavaScript、CSS、图片等资源文件转换并整合到一起，生成适合部署到生产环境的静态资源。然而，在实际的项目开发过程中，可能会遇到一些问题，比如在本例中提到的`iconfont`图标...
vue项目发布有缓存，正式环境不更新（解决方案）
山有木兮木有枝 心悦君兮君不知
03-15 6668
前端防止缓存
vuecli3项目打包防止缓存，不更新
热门推荐
chantel186的博客
08-01 1万+
首先在src根目录下新创建一个vue.config.js文件， 其次在configureWebpack: config => {}里面添加时间戳， 这样每次打包生产的js文件就会自动添加【模块名称.版本号.时间戳】 在该文件里面配置这段核心的 代码，完整的代码如： function resolve(dir) { return path.join(__dirname, dir...
Vue打包问题
xuedengyong的博客
05-14 380
Vue打包会遇见各种各样的问题，总结如下， 1.打包后页面为空白，没有报错信息 一般是Router中的mode被设置成了history模式，如 export default new Router({ linkActiveClass: 'active', // mode: 'history', //加入这一句即可去掉路径中的# routes: [] 因为VUE根据#确认根路径，然后获取...
vue-cli4+项目打包后生成可修改的配置文件
qq_39241544的博客
06-16 2964
创建免打包JSON配置文件文件 cli4+在public文件夹下面新建一个json配置文件，cli4版本以下则在static文件夹下新建即可 { "baseSize": 100, "autoLogout": 6900, "axiosConfig": { "withCredentials": true, "baseURL": "/api" } } 通过axios获取 在main.js中通过axios获取配置文件中的数据，cli4版本以下请求路径为/static/config.
在vue中将json数据导出为单个json文件或者包含多个json文件的压缩包
qq_44308920的博客
06-16 3778
需求：为了项目数据的可移植性，决定以json文件的方式进行数据移植。对于单个数据项，可能涉及其关联的一系列数据，如根据数据项的id查询出相关联的子项数据，故导出的话希望以单数据项单json文件的方式。但为了方便，又需要批量导出并合并为一个压缩包。（此处只涉及前端导出解决方案）FileSaver | JSZip......
vite项目修改依赖不更新，清除依赖缓存
苦夏木禾
03-02 9439
vite项目修改依赖不更新，清除依赖缓存
如何实现vue项目读取配置文件，不重新打包
好记性不如烂笔头
01-14 7142
在项目开发时，经常遇到开发环境和生产环境因为某几个引用地址或是参数不一致，部署测式环境打个包，上线生产时又要重新出包，这样测试又会担心最后这此打包会不会出问题，到生产环境还有问题，为了解决这个问题，特将这些配置信息剥离出来，不在进行重新打包，只需要修改一个文件，vue打包好的项目直接读取配置文件内容就可以了。具体方法如下： 1、public下创建project.config.json pro...
vue3+vite本地json文件打包与读取时遇到的问题
m0_72072486的博客
04-19 1293
若是放在src文件夹下在打包的时候本地json文件打包不进去。推荐把本地json文件放在public文件夹中。本地json数据在vue3中可以直接读取。
vue 打包生成json 文件列表
05-18
在 Vue 中，打包生成的静态资源文件列表可以通过 webpack 的插件 `webpack-manifest-plugin` 来生成。 首先，在项目中安装 `webpack-manifest-plugin`： ```bash npm install --save-dev webpack-manifest-plugin ...
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值