一、 使用Vite创建Vue3项目 1.全局安装vite,使用命令npm install vite -g 2.创建vue3项目,使用命令 npm create vite@latest ,确认项目名 称,选择Vue及TypeScript 3. 使用用vscode打开项目,运行命令 npm install npm run dev 4.整个项目目录结构如下:5.访问页面 二、将打包项目发布到Nginx 1.将打包后...
1.4 Vite与Vue CLI的比较 虽然Vue CLI 仍然是一个非常强大的前端构建工具,但 Vite 在某些方面提供了显著的优势。以下是 Vite 与 Vue CLI 的一些主要区别: 启动速度:Vite 利用原生 ES 模块导入,实现了极快的冷启动速度。相比之下,Vue CLI 需要编译和打包所有依赖项,启动速度较慢。 热模块更新(HMR):Vite 的 ...
VUE3+VITE项目开发环境连接后端和打包部署连接后端设置是不一样的:一个是直接在vite.config.ts中配置,一是要用nginx来做代理;二是注意nginx的配置的地址后面的"/"。
方法一: 下载nginx,然后使用xftp传输到云服务器上 方法二: 命令行下载 http://nginx.org/download/ wget http://nginx.org/download/nginx-1.13.6.tar.gz 1. 2. 3. 2.2 解压nginx安装包 进入nginx目录 tar -zvxf nginx-1.13.6.tar.gz cd nginx-1.13.6 1. 2. 2.4 make编译安装nginx ./configure --...
start nginx 不报错说明启动成功,如图: 在浏览器输入localhost,显示如下页面说明能够正常启动: 二、同一个nginx部署多个项目 视频地址:https://www.bilibili.com/video/BV1fG4y1a7Sv/?spm_id_from=333.337.search-card.all.click&vd_source=5f425e0074a7f92921f53ab87712357b ...
nginx部署如图: nginx配置 1.部署后资源文件访问不对 访问资源js路径404 解决方案:在vite.config.production.ts(生产环境的配置文件),对应的base属性设置要部署的目录‘/arcodesignpro/’,如下图: 参考文档:配置 Vite | Vite 官方中文文档 2.部署在非根服务目录下,如:部署在http://192.168.31.223:8090/arcodesig...
实现步骤如下:1、调整vite.config.js配置文件 在该文件中,添加配置:base:'/project1'base:'/myapp...
nginx配置 1.部署后资源文件访问不对 访问资源js路径404 解决方案:在vite.config.production.ts(生产环境的配置文件),对应的base属性设置要部署的目录‘/arcodesignpro/’,如下图: 参考文档:配置 Vite | Vite 官方中文文档 2.部署在非根服务目录下,如:部署在http://192.168.31.223:8090/arcodesignpro/下,路由跳...
vite vue3 打包到Linux 环境nginx需要的配置 linux部署vue项目到nginx,本博客是总结本人在linux服务器上将vue项目部署到Nginx上的经历一.准备好vue项目1.安装vue环境2.打包vue项目进入你项目的文件夹,找到config文件夹下的index.js文件(config/index.js),打开修改里面a