如何修改Vue build过后的dist文件的位置

最新推荐文章于 2024-08-01 14:29:45 发布
最新推荐文章于 2024-08-01 14:29:45 发布
阅读量2.3k 收藏
点赞数 1
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43575827/article/details/103090259
版权

文件编译后部署到服务器静态文件夹

由于前端每一次部署过后都会生成新的dist文件，但是这个时候后端也要将服务器上的文件更新，为了减少麻烦，这样我们就可以将生成的dist文件夹直接放到服务器文件夹上。
按照下图指示的位置上更改就可以了
在这里插入图片描述
index是index文件生成的位置
assetsRoot是dist文件生成的位置。

Faith_ZL
关注
关于Vue修改默认的build文件存放的dist路径
weixin_34353714的博客
12-05 1776
原文地址：http://www.cnblogs.com/JimmyBright/p/7681086.html Vue默认build路径是项目的dist目录下，有时候我们可能希望build之后的文件自动放在本机的某个其他路径下 按照下面的路径修改即可： 我这放在D盘下的一个路径下的bapp目录下，这个目录本机配置了apache服务器，如果要求放在这个目录下，本机的服务器就能运行这个站点 ...
webpack 打包后的dist文件进行特殊性修改
诸葛韩信--一个前往前端不归路的浪子
11-04 4193
一、webpack打包文件——dist dist文件默认是webpack打包之后的最外层文件夹。一个web前端项目，往往会有比较多的文件，而图片、js、css都是必须的，当然如果是扩展的话，还有很多其他的文件，比如说字体，html，ts，html，jsx等。比如下图的目录结构： 二、加密或者路径或者其它需求 当文件需要加密的时候，就需要将代码中的一些敏感信息加密。这个时候，我们往往...
Vue反编译dist包到源码
最新发布
油墨香^-^的博客
08-01 797
1.首先需要在管理员模式下打开cmd2.找到需要编译的dist/static/js的目录下 执行完成后在该目录会看到目录下存在下面的文件名：0.7ab7d1434ffcc747c1ca.js.map，这里以0.7ab7d1434ffcc747c1ca.js.map为例，如下图:3.全局安装reverse-sourcemap资源npm install --global reverse-sourcemap4.反编译 执行：reverse-sourcemap --output-dir source。
vite 更改 dist 存放的路径
最爱喝怡宝的博客
02-14 3060
vue项目执行 npm run build 后会生成一个 dist 文件夹，这个文件夹默认存放在项目最外层目录，项目下 vite.config.js，记录一下更改存放位置的方法。
vue项目打包生成外部配置文件修改后端访问地址
山谷里的杂货铺
07-04 3981
前端打包需要向后台问一个接口访问地址，测试环境、生产环境都需要一个地址，每次打包时都要前端切换地址，感觉很麻烦，现在这个方法是打包后，在配置文件中修改地址。1、在public 文件下新建一个config.js文件，并进行编辑 2、找到你请求接口的地方 3、修改Index.html文件，引入config.js文件 4、dist包 只要修改dist包下的config.js文件的url就可以了...
【项目实训】前端页面修改1
m0_63711281的博客
05-30 382
因此，在我们完成开发后，我们计划固定某些选项，如大语言模型的选择、知识库的选择等，以使这些细节对用户来说不可修改，从而保持对用户的透明性。设定知识库匹配条数、匹配分数阈值固定，其实这里也可以设定知识库固定，但是暂时未编写，因为我们的数据还未完全上传至知识库中。设置公司列表，并使用streamlit的selectbox设置下拉框，但是这里还未关联到后端，因此切换公司时暂时无反应。暂时修改前端页面使之呈现出我们希望呈现的页面，但是没有关联到后端，没有添加相关动作。修改全部页面的侧边栏设置。
Vue 运行打包后的dist文件
leg的博客
02-25 5479
终极方式 npm install -g serve serve -s dist
vue 查看dist文件里的结构(多种方式)
10-15
在 `package.json` 文件中添加一个新的命令，如 `"report": "vue-cli-service build --report-json"`。这个命令会告诉 Vue CLI 在打包时生成一个 `report.json` 文件。执行 `npm run report` 命令后，`report.json` ...
详解webpack打包vue项目之后生成的dist文件该怎么启动运行
10-16
webpack打包vue项目之后生成的dist文件启动运行的方法涉及到多个步骤和知识点，包含了Vue、webpack、Express以及Node.js的综合运用。下面将详细解析每个步骤背后的原理和技术点。 ### webpack打包Vue项目 webpack...
解决vue项目 build之后资源文件找不到的问题
01-19
解决静态资源失效的问题 这就需要修改我们的 config 中的 index.js了，默认的build 中的部分是这样的： build: { ... index: path.resolve(__dirname, '../dist/index.html'), ...修改之后的应为这样的: build: {
vue本地打开build后生成的dist文件夹index.html问题
10-16
主要介绍了vue本地打开build后生成的dist文件夹index.html问题，本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友参考下吧
Vue项目的打包方式（生成dist文件）
热门推荐
商务合作 | 共同学习 | 携手共进
12-30 15万+
打包vue项目，生成dist文件夹。
vue项目打包之dist反编译
weixin_47269950的博客
06-07 1万+
批处理器脚本
最快捷的两种方案彻底解决：vue打包后dist目录下的index.html网页显示空白的问题
在写作的路上持续输出。
03-27 1万+
📢：解决vue 打包后dist 目录下index.html 页面空白的问题。两种方案快速解决......
根据vue打包出来的dist文件进行反编译,推出代码
weixin_37601321的博客
06-13 1万+
111
dist 还原vue_vue 查看dist文件里的结构
weixin_39843078的博客
02-01 2167
场景：优化打包后的代码，提高性能。1.方式一：report-json。1.1 package.json文件里加入以下命令，"report": "vue-cli-service build --report-json"1.2然后控制台运行 npm run report1.3 结果：会在dist文件夹里生成 report.json。里面有打包后每个文件的来源。2.方式二：使用stats-webpa...
将vue打包的dist部署到springboot项目中（前后端不分离）
进击的豌豆的博客
04-13 6005
首先将打包好的dist文件夹放到resources下 然后在yml文件中配置 spring: web: resources: static-locations: "classpath:/dist" 运行程序然后访问lip:port/index.htm即可
【vue】jenkins打前端包时报错：第 8 行:cd: dist: 没有那个文件或目录
m0_46459413的博客
12-15 613
发现报错信息是找不到dist文件，项目中默认的前端打包名称为dist，于是发现问题。就是项目中打完前端包后名称不叫dist。jenkins打前端包时报错：第 8 行💿 dist: 没有那个文件或目录。
vue build打包为啥每次都要删除dist文件才不会报错
06-14
在打包 Vue 项目时，dist 文件夹是存放打包生成的文件的目录。如果上一次打包时没有删除旧的 dist 文件夹，那么在下一次打包时，新生成的文件会与旧的文件混在一起，可能会导致打包出错或者无法正常运行。因此，每次打包前最好先删除旧的 dist 文件夹。可以在 package.json 文件中的 scripts 中设置一个命令来实现自动删除旧的 dist 文件夹，例如： ``` "scripts": { "build": "rm -rf dist && vue-cli-service build" } ``` 这样在运行 `npm run build` 命令时，就会自动删除旧的 dist 文件夹，然后再进行打包。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值