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

最新推荐文章于 2024-05-16 13:10:03 发布
最新推荐文章于 2024-05-16 13:10:03 发布
阅读量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 4020
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 7346
之前打包完后给后台，很好能展示出来，但是verdor很大，加载超级慢，用了路由懒加载，才好多了，但还是没有达到想要的效果，那就继续优化吧，以下是我的优化过程，有些可能不沾边或者还没解决的，欢迎留言告知，多谢 路由懒加载 这个在npm run build 打包爬坑记第5条中已说明 main.js优化思路 这是个老话题了，项目中一般都需要引入插件（例如：mint-ui），但不能在main.js...
Vue基础知识总结 10：使用vue-cli（vue脚手架）快速搭建项目_vuecli搭建项目(1)
最新发布
2401_84447043的博客
05-16 420
阿里十分注重你对源码的理解，对你所学，所用东西的理解，对项目的理解。开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】一、什么是VueCLI1、如果你只是简单写几个Vue的Demo程序，那么你不需要VueCLI脚手架。2、如果你在开发大型项目，那么你需要，并且必然需要使用VueCLI。3、CLI是什么意思？4、脚手架长什么样？5、脚手架依赖于node.js和webpack二、安装Vue CLI脚手架三、runtime-compiler和runtime-only的区别。
react项目打包 + npm快速搭建以某一文件夹为根目录的服务器
qq_45560350的博客
11-23 1339
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 1741
npm install serve -g 搭建本地服务器
npm run build
X01动力装甲的专栏
01-12 103
image.png image.png image.png
html粘贴绝对路径报错,npm run build生成路径问题
weixin_42131861的博客
06-18 435
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-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-cli打包后本地运行dist文件中的index.html操作
01-19
使用npm run build生成dist文件夹中的文件是你需要上传到服务器上的文件， 直接打开index.html会直接报错 可以尝试用express搭建一个服务器，做法如下： 1、在dist根目录下新建server.js文件； 2、代码如下： var ...
vue学习（五）—vue-cli构建vue项目目录结构
黄孝果的博客
03-30 6245
安装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 1901
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 1563
├─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 5875
博客园 首页 新随笔 联系 管理 订阅订阅 随笔- 55 文章- 0 评论- 1 vue-cli项目打包需要修改的路径问题 命令行输入：npm run build 打包出来后项目中就会多了一个文件夹dist，这就是我们打包过后的项目。 第一个问题，文件引用路径。我们直接运行打包后的文件夹中的index.html文件，会看到网页一片空白，f12调试，全是css，js路径引用错误的问...
npm run build打包时修改的路径
06-19 2800
转载于:https://www.cnblogs.com/wstmljf/p/11052526.html
日常开发记录--npm run build:prod打包后的文件在dist文件夹下
machine_vision123的博客
04-27 1759
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
您好！根据提供的信息，这些是在geeyoou项目中可用的npm脚本命令： - `npm run dev`：用于启动开发服务器，运行`vue-cli-service serve`命令。 - `npm run build:prod`：用于构建生产环境的项目，运行`vue-cli-service build`命令。 - `npm run build:stage`：用于构建测试环境的项目，运行`vue-cli-service build --mode staging`命令。 - `npm run preview`：用于预览构建后的项目，运行`node build/index.js --preview`命令。 - `npm run lint`：用于运行eslint检查代码规范，运行`eslint --ext .js,.vue src`命令。 您可以通过在项目根目录下运行这些命令来执行相应的操作。例如，使用命令`npm run dev`来启动开发服务器。请确保在执行这些命令之前，已经安装了必要的依赖项（使用`npm install`命令）。 希望这可以帮助到您！如果您有其他问题，请随时提问。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值