vue 项目上传服务器之打包

最新推荐文章于 2023-08-31 16:54:49 发布
最新推荐文章于 2023-08-31 16:54:49 发布
阅读量376 收藏 2
点赞数
CC 4.0 BY-SA版权
分类专栏： 服务器配置
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/Mybabyying/article/details/103927440
本文介绍如何在Vue项目中修改图片目录路径，并详细说明了项目打包的步骤，包括使用npm命令进行打包，以及成功后的dist文件夹生成。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

一、修改图片目录

打开项目，在config文件夹中找到index.js文件，并打开。
找到 build 部分代码并修改为如下图所示保存：
在这里插入图片描述

二、项目打包

目录修改完成之后，开始打包
首先使用cmd进入项目，输入一下npm命令

cnpm run build

打包成功后，在你的vue项目中会多出一个dist文件夹
在这里插入图片描述
打包完成

vue图片上传压缩
10-18
在移动Web蓬勃发展的今天，有太多太多的应用需要让用户在移动Web上传图片文件了，正因如此，我们有些困难必须去攻克： 低网速下上传进度缓慢，用户体验差 高并发下，后台处理较大的上传文件压力大 或许有更多...
vue项目打包后提交到git上为什么没有dist这个文件的解决方法
10-14
Vue.js项目在开发过程中，通常会使用`npm run build`命令进行打包，打包后会在项目根目录下生成一个名为`dist`的文件夹，其中包含了编译后的静态资源，适合部署到生产环境。然而，有时候将项目推送到Git仓库时，可能...
vue项目打包发布到服务器
hellojoy的博客
04-10 1823
1，tomcat： tomcat下部署静态文件。一般情况下，网站也做到静态文件的分离。静态文件这个时候就需要部署到特定的服务器上了。一般会部署到nginx上。如果做测试的话，也会部署到tomcat上。 部署的方法为： 在tomcat的conf目录下的server.xml文件中做相应的配置即可。 1.在<host></host>中添加配置。 <Context ...
vue项目怎么上传到web服务器,vue项目如何通过脚本自动打包上传服务器
weixin_35686386的博客
08-05 511
问题描述平时部署前端项目，都是手动在命令行里敲：npm run buildbuild完成再手动 scp 输入服务器地址，目录，密码上传到服务器上很是麻烦可不可以写个脚本什么，只需输入一个命令，就能完成上述动作PS:持环开行打进对端架处参触架码我通会法时果项目多是vue-cli webpack模版直分调浏器代，刚求的一学础过功互有解小久宗点差维含数如搭建的已搜到方法中比需抖接朋功要朋插 谢谢各位这是...
vue之如何打包上传服务器
粥可温
10-16 1764
首先再项目文件夹打开cmd命令输入打包命令然后再你的文件夹下会出现一个dist的文件。
vue中大文件上传webuploader前端用法
weixin_56455782的博客
11-16 4471
vue中大文件上传webuploader前端用法 首先呢需要安装webuploader； 命令: npm i webuploader -S 下载完成以后在vue文件中引入 //引入webuploader import WebUploader from "webuploader"; import "webuploader/dist/webuploader.css"; 然后页面中需要有上传按钮和上传列表以及上传进度条的东西，首先写好dom页面中 <el-row class="webUploader"&
Vue3项目打包后部署到服务器 请求不到后台接口解决方法
11-20
本地开发没问题能正常请求到接口，部署后页面也能展示出来就是接口的数据请求不到 network一看是这么个情况 对比了本地的页面 可以发现是remote address出了问题。 ... 我的猜想是proxy代理在本地环境下用的是...在Vue
vue项目打包部署到服务器的方法示例
10-18
Vue项目通常会经历开发、构建、部署这几个步骤，而项目打包部署到服务器则是将开发好的Vue项目移至生产环境的重要环节。本文详细介绍了将Vue项目打包并部署到服务器上的具体方法和步骤，同时也会涉及到一些在部署...
vue-cli3项目打包后自动化部署到服务器的方法
10-14
然而，当项目开发完成后，我们需要将其打包并部署到服务器上供用户访问。这里我们将详细讲解如何使用 Vue CLI 3 实现项目的自动化打包与部署。 首先，确保你的项目已经使用 Vue CLI 3 创建，并且配置好相关的构建...
vue.js框架图片上传组件.zip
07-04
vue.js框架图片上传组件是一款适用于手机端的图片上传代码，支持批量上传，拖到图片上传，显示文件数量和大小等功能。
Vue 图片压缩并上传至服务器功能
10-15
主要介绍了Vue 图片压缩并上传至服务器功能，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下
服务器使用记录（Vue项目上传到云服务器）
是我哇
01-13 724
服务器使用记录（Vue项目上传到云服务器） 啦啦啦啦，总算折腾好了 准备的工具 1.腾讯云服务器 学生机购买就OK啦 2. WinSCP 、Xftp 6 、Xshell 6 需要下载以上工具 linux的命令行需要补起来~（flag） 3.postman 可以方便看接口的数据，方便测试 以上都准备好之后，就可以开始啦 开始 1.关于下载的东西 node.js 这里有两种方法 一个是wget 方...
vue上传图片并压缩
qq_31001061的博客
05-12 1144
需求：点击用户头像选择本地图片压缩上传到服务器 这里用vant UI组件的Uploader 文件上传 按需加载Uploader import {Uploader} from 'vant'; Vue.use(Uploader) 在dom上 <van-uploader :after-read="updateFile" accept="image/jpg" :max-size="10485760" @oversize="fileMax"> <img :src="..
vue前端js上传压缩包或excel文件，读取excel内容
HanShao_的博客
08-18 1316
一、应用背景是vue前端上传.zip等文件，对zip解析分类。取出excel内容展示。
vue项目如何上传服务器,vue项目如何通过脚本自动打包上传服务器
weixin_42502503的博客
08-10 543
问题描述平时部署前端项目，都是手动在命令行里敲：npm run buildbuild完成再手动 scp 输入服务器地址，目录，密码上传到服务器上很是麻烦可不可以写个脚本什么，只需输入一个命令，就能完成上述动作PS:项目多是vue-cli webpack模版搭建的已搜到方法 谢谢各位这是我找到的方案：《简单配置前端工程实现文件打包好后自动上传至服务器》文中使用的gulp-sftp我没用过，不知道是哪...
vue3 项目使用 jszip 和 file-saver 打包压缩上传单个文件或者文件夹
qq_44871531的博客
08-11 1529
vue3 项目使用 jszip 和 file-saver 打包压缩上传单个文件或者文件夹
vue之项目打包部署到服务器
zuo_zuo_blog的博客
01-05 2026
第一步：这是很关键的一步。打开项目，找到config文件夹下的index.js。搜索 assetsPublicPath 默认值为 ‘/‘ 应改为你要挂在到服务器的那个文件下的路径 。 第二步：因为在开发时 会有跨域问题 我们为了方便会配置跨域代理比如proxyTable 部署到服务器上所以到服务器上之后就不存在跨域了,注销掉。 第三步：解决部署后图片图表路径404问题如xxxx/static/css/static/css/xxx这样的路径 在build/utils 中，找到这里添加 public
Vue3上传文件/文件夹/压缩包（包含拖拽实现）
Oamnij的博客
08-31 2623
vue3上传文件/文件夹/压缩包（包含拖拽实现）
vue项目打包上传服务器
最新发布
09-06
要将Vue项目打包并上传到服务器，您可以按照以下步骤进行操作： 1. 在终端中进入Vue项目的根目录。 2. 运行以下命令以生成用于生产环境的打包文件： ``` npm run build ``` 这将在项目根目录下生成一个`dist`...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值