vue-cli 打包压缩(npm run build)文件后,默认根目录修改

最新推荐文章于 2024-06-06 15:52:11 发布
最新推荐文章于 2024-06-06 15:52:11 发布
阅读量1.7w 收藏 1
点赞数
分类专栏： vue-cli webpack 文章标签： vue-cli npm run build 压缩 根目录
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u013362969/article/details/72312700
版权

vue-cli 打包压缩(npm run build)文件后,默认根目录修改，解决前后端代码结合的路径问题。

将config/index.js文件中的assetsPublicPath 值修改为你需要的根目录，原来默认是‘／’，下图中加上了"elkdashboard/"，“elkdashboard”是本项目的项目名，用tomcat起的服务URL默认根目录会加上“／项目名／”。这样将打包好的代码放到项目的webapp目录下就不会出现根目录不统一的情况了
’

毅江
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue打包后 静态文件路径问题处理
日常笔记/总结/系列知识梳理
06-06 4026
1、js，css路径不对 解决办法：打开config/index.js，将其中的assetsPublicPath值改为’./’ assetsPublicPath:'./' 2、css中引用的图片资源找不到 打开“build/utils.js”，增加一行代码即可： publicPath:"../../" 相关文章： https://www.cnblogs.com/diantao/p...
npm run build 打包爬坑记（3）打包压缩优化
陌上花开
07-01 7362
之前打包完后给后台，很好能展示出来，但是verdor很大，加载超级慢，用了路由懒加载，才好多了，但还是没有达到想要的效果，那就继续优化吧，以下是我的优化过程，有些可能不沾边或者还没解决的，欢迎留言告知，多谢 路由懒加载 这个在npm run build 打包爬坑记第5条中已说明 main.js优化思路 这是个老话题了，项目中一般都需要引入插件（例如：mint-ui），但不能在main.js...
vue2从0开始打包发布npm包，踩坑无数，完整版
最新发布
qq_45624939的博客
06-06 987
初始化的package.json中“name”参数就是要发布的npm包的名字，必须是唯一的，可以去npm官网搜一搜有没有重名的；三、假设两个.vue文件就是我们想要打包的组件，我们要先将他们暴露出去，在项目的根目录（src同级）或src/components文件夹中新建一个文件index.js。这时候，项目就成功启动起来了，打开链接 http://localhost:8080 ，就可以看到我们的项目了。按回车后，大概需要5分钟，甚至更久，才会新建成功，慢慢等待。至此成功，真是踩了无数的坑！
react项目打包 + npm快速搭建以某一文件夹为根目录的服务器
qq_45560350的博客
11-23 1344
1.新建文件夹test，在test文件夹里新建index.html文件 2.命令行进入test文件夹 cd xxx\xxx\test 3.命令行全局安装serve插件 npm i serve -g 4.1 输入命令 serve 即可 4.2 如果想以test文件夹下的demo文件夹（里面有index.html文件）作为服务器的根目录，则输入serve a或serve ./a ...
npm搭建本地服务器，直接运行build后的目录
青春_奋斗不息
08-02 1759
npm install serve -g 搭建本地服务器
npm run build
X01动力装甲的专栏
01-12 105
image.png image.png image.png
html粘贴绝对路径报错,npm run build生成路径问题
weixin_42131861的博客
06-18 442
vue项目中可以使用npm run build 命令生成静态文件夹dist，开发者可以直接点击dist文件夹下面的index.html问价来访问自己的项目，但是用vue-cli生成的项目，当运行npm run build 时，生成的index.html中的文件是绝对路径(问题一)直接打开index.html之后就会报错：因为vue-cli的默认配置中, assetsPublicPath是用绝对目录...
基于vue-cli npm run build之后vendor.js文件过大的解决方法
01-21
vue-cli npm run build命令默认把dependencies中的依赖统一打包，导致vendor.js文件过大，出现首屏加载过于缓慢的问题。 解决方案 像vue、axios、element-ui这些基本上不会改变的依赖我们可以把它们用cdn导入，没有...
vue-cli中打包图片路径错误的解决方法
08-29
然后，用npm run build命令打包完成后，将dist文件夹放到子目录下，这样图片就可以正常显示出来。 总结 本文介绍了vue-cli中打包图片路径错误的解决方法，包括部署到根目录下和部署到子目录下的两种方法。这些方法...
vue-cli3分环境打包
01-20
在项目根目录下，我们需要创建 `.env` 文件来定义环境变量。例如： - `.env.development`: 用于开发环境，可以定义如 `VUE_APP_API_URL=dev.api.com`。 - `.env.pre`: 用于预发布（测试）环境，如 `VUE_APP_API_...
关于vue-cli3打包代码后白屏的解决方案
01-19
按照以往的流程 npm run build 问题来了 打开 dist index.html 文件发现白屏。打开调试后 发现文件引用路径不对 根据以往的经验 根目录下新建 vue.config.js 配置 publicPath module.exports = { ... runtime...
vue-cli开发的商城源代码
01-18
在开发过程中，开发者可以通过`npm run serve`命令启动本地开发服务器，`npm run build`命令将项目打包成生产环境的静态资源。 此项目展示了Vue.js在构建大型电商应用中的应用，涉及到前端架构设计、组件化开发、...
vue学习（五）—vue-cli构建vue项目目录结构
黄孝果的博客
03-30 6248
安装node.js 下载地址：https://nodejs.org/zh-cn/download/ 直接进行安装，安装完成node.js后自动帮助完成npm的安装， 查看是否完成可以到环境配置中查看。 查看npm是否安装成功并安装vue-cli 安装淘宝镜像 npm config set registry https://registry.npm.taobao.or...
npm run build生成路径问题
weixin_33991727的博客
09-18 1904
vue项目中可以使用npm run build 命令生成静态文件夹dist，开发者可以直接点击dist文件夹下面的index.html问价来访问自己的项目，但是用vue-cli生成的项目，当运行npm run build 时，生成的index.html中的文件是绝对路径 （问题一） 直接打开index.html之后就会报错： 因为vue-cli的默认配置中, assetsPublicPath是...
关于vue的npm run dev和npm run build
u011927449的博客
05-31 1564
├─build │ ├─build.js │ ├─check-versions.js │ ├─dev-client.js │ ├─dev-server.js │ ├─utils.js │ ├─vue-loader.conf.js │ ├─webpack.base.conf.js │ ├─webpack.dev.conf.js │ ├─webpack.prod.conf.js │ └─webpack.test.conf.js ├─config │ ├─dev.env
vue项目打包需要修改的路径问题
知其白，守其黑；和其光，同其尘。
03-09 5916
博客园 首页 新随笔 联系 管理 订阅订阅 随笔- 55 文章- 0 评论- 1 vue-cli项目打包需要修改的路径问题 命令行输入：npm run build 打包出来后项目中就会多了一个文件夹dist，这就是我们打包过后的项目。 第一个问题，文件引用路径。我们直接运行打包后的文件夹中的index.html文件，会看到网页一片空白，f12调试，全是css，js路径引用错误的问...
npm run build打包时修改的路径
06-19 2816
转载于:https://www.cnblogs.com/wstmljf/p/11052526.html
日常开发记录--npm run build:prod打包后的文件在dist文件夹下
machine_vision123的博客
04-27 1816
npm run build:prod打包后的文件在dist文件夹下
【3】npm run build Vue的项目，如何修改相对路径配置
热门推荐
我驾驶汽车从不是为了从A点到达B点，我喜欢去感受汽车，与之交流，与之融为一体。
09-06 1万+
如果静态文件不是部署在网站根目录下，vue-cli将给你造成巨大的麻烦，你不能直接把build好的文件抛进一个目录，你不能直接在本地打开用vue做好的静态网站。改成相对路径，主要需要做两步： 1、修改config => index.js => build => assetsPublicPath 中的'/'成为'./' （注意！很多同学直接在dev:{}里面的assetsPubl...
C:\Users\admin\geeyoukindergarten\geeyoou-ui>npm run Scripts available in geeyoou@3.8.1 via `npm run-script`: dev vue-cli-service serve build:prod vue-cli-service build build:stage vue-cli-service build --mode staging preview node build/index.js --preview lint eslint --ext .js,.vue src
07-13
- `npm run build:prod`：用于构建生产环境的项目，运行`vue-cli-service build`命令。 - `npm run build:stage`：用于构建测试环境的项目，运行`vue-cli-service build --mode staging`命令。 - `npm run preview`...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值