vscode+vue3+高得地图开发过过程中本地视频及地图json文件的发布问题

很久没发blog了,最近vscode+vue3+高得地图开发中,因为有开发的视频教程,还有地图的边界的.json文件,这些静态文件发布时,如果处理不当,build命令会将这些静态文件进行打包。打包后文件名变化了,这样,你的代码在访问这些文件时,就找不到文件了。

处理办法:

1、关于静态文件如:.mp4 、.json文件的存放位置问题:

比如:前端运行后为:  http://xxx.xxx.xxx:9500/,那么该文件夹对应的路径为:src所在的目录。

比如:我的json文件是放在src/mapjson/的文件夹下的:

访问的时候:

2、如何让这些.mp4   .json静态文件在build时,不参与打包,即不修改文件名(打包后全部会封装到js文件中)。处理办法:

3、发布时,public文件夹下面的文件会原封不动的Copy到发布后的文件夹下面,所以,也需要将json文件COPY一份到:public文件夹下:

### 如何在 VSCode 中设置和使用 Vue3 #### 设置用户代码片段以快速生成自定义 Vue3 模板 为了实现这一功能,在 VSCode 的设置中,需选择“用户代码片段”,输入 `vue` 并回车确认,从而打开 `vue.json` 文件。在此文件内,应将其内容更新如下: ```json { "Print to console": { "prefix": "v3", "body": [ "<script setup lang=&#39;ts&#39;>\n\n</script>\n\n<template>\n <div>\n\n </div>\n</template>\n\n<style scoped lang=&#39;scss&#39;>\n\n</style>" ], "description": "vue3的ts模板" } } ``` 上述配置允许通过键入前缀 `v3` 后按下 Tab 键来迅速创建指定结构的 Vue 组件[^1]。 #### 解决 Vscodevue 命令无法正常工作的问题 当遇到诸如 `vue -V` 或者 `vue create demo_vue` 这样的命令不起作用并抛出错误的情况时,可能是因为全局安装的 Vue CLI 版本过低或是未正确安装。此时建议先尝试升级或重新安装 Vue CLI 工具,确保环境变量已正确配置以便于命令行工具能够识别这些指令[^2]。 #### 配置调试选项支持 Vue 开发 对于希望利用内置调试功能开发 Vue 应用程序的开发者来说,在 VSCode 中可以通过简单的几步完成必要的设定。具体而言,只需按照常规方式启动调试过程——即按 F5 或者点击调试面板里的绿色箭头即可触发 Chrome 浏览器加载本地服务器地址(通常是 http://localhost:5173),进而方便地进行断点调试和其他交互操作[^3]。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

xjzdr

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值