1、项目创建首先我们要安装好vue，网上安装教程很多，这里就不就行介绍啦 下面我们就可以进行，我们的项目创建了 首先打开一个我们需要创建项目的目录在该目录下打开我们的cmdvue init webpack vue-demo1 #这里的vue-demo1就是我们所要创建的项目的名称剩下的就一直回车就可以了 等着创建完成就可以了 然后，我们cd进入到我们刚刚创建的工程目录中 在输入我们的运行命令npm
转载
2023-09-22 14:38:27
151阅读
前端项目打包、Nginx的启动暂停、Nginx配置1、前端打包首先配置前端环境.env.preview文件中VUE_APP_API_BASE_URL指向后端地址之后，使用命令 yarn run build 打包后前端根目录出现dict文件夹yarn run build 或者 npm run build使用Nginx代理部署前端 -配置内容server {
listen
转载
2024-06-10 10:23:27
1555阅读
1.vue项目打包1.1 终端运行打包命令在编辑器的终端运行vue项目打包命令yarn run build打包成功如下：这时我们可以看到项目目录多出来一个dist文件夹，记住它，后面部署就靠它了。1.2 修改配置就我个人部署经历(宝塔面板快速部署)来说，这个配置是一定要修改的，如果不修改配置，直接将build后的dist包部署，运行后页面是空白的。修改配置要分两个处理方式（vue-cli2和vue
转载
2023-12-17 10:28:06
81阅读
1、一般打包 ：直接 npm run build。（webpack的文件，根据不同的命令，执行不同的代码的） 注：这种打包的静态文件，只能放在web服务器中的根目录下才能运行。2、在服务器中 非根目录下 运行的 打包：需要配置 参考： 3、在本地文件系统中打开，不需要web服务器 暂时 不清楚4、使用 history模式 打包的 配置 ： http:
转载
2024-03-28 21:29:22
37阅读
前言Vue项目一般用于实现前端的单页面富应用，其打包后的文件可简单看作静态文件，所以可以通过Nginx部署，当然也可以通过django部署(毕竟本质上还是一个html文件及各CSS,JS文件的集合)。不过前后端的耦合性以及性能就比nginx动静分离的差一点。但平时开发的时候可以这样部署，十分方便快捷。测试所使用框架版本 django 3.06，VueCli 3.0Vue打包修改vue.config
转载
2024-07-31 15:43:45
33阅读
从三个插件开始1、CommonsChunkPlugincommonsChunkPlugin 是webpack中的代码提取插件，可以分析代码中的引用关系然后根据所需的配置进行代码的提取到指定的文件中，常用的用法可以归为四类：（1）、提取node_modules中的模块到一个文件中；（2）、提取 webpack 的runtime代码到指定文件中；（3）、提取入口文件所引用的公共模块到指定文件中；（4）
前言现在项目都是前后端分离的，所以前端要会部署前端项目。Nginx是一款轻量级的Web服务器、反向代理服务器，由于它的内存占用少，启动极快，高并发能力强，在互联网项目中广泛应用，所以我们的项目也使用Nginx部署。打包项目首先，使用vue打包命令,打包待部署的项目，生成dist文件夹备用：npmrunbuild服务器安装Nginx输入nginxv,看是否正确输出Nginx的版本号，如果可以正确输出
原创
2022-08-14 23:35:21
1046阅读
前端每次打包完成项目后都需要连接服务器上传到指定文件夹，这样子很繁琐也很浪费摸鱼的时间，所以我根据学到的打包钩子突然奇想，利用package.json文件执行的脚本完成打包并自动部署一体化，我的思路是打包完成后压缩文件夹然后上传至服务器目录进行解压替换，我可能不是第一个想到这种方法的，但也是根据自己的思想总结出来的，整体实现如下。 每次打包都会执行npm run build 这个命
遇到的问题为vue项目webpack-dev-server配置后本地连接服务器地址正常请求，但是打包之后请求服务器接口一直是404；Vue前端打包：1.npm run build:prod 打包 2.npm run preview 打包正式环境预览.env.product(生产环境配置)文件，我这边是将接口地址也放到了里面VUE_APP_API_URLvue.config.js文件 反向代理及路由
转载
2023-10-19 10:50:47
191阅读
今天有时间分享一些平时自己开发上的一些构建配置，我们以Vue-CLI-2.x来构建开发环境。 好，我们先来看一下我们要做哪些工作。 现附上源码地址，https://github.com/749264345/Vue-CLI-2.x1.Vue,Vuex,vue-router,axios通过CDN引入；优化打包后文件过大的问题 2.开发环境区分开发，测试，生产；提高开发效率 3.打包区分测试与生产 4.
转载
2024-01-05 22:30:22
160阅读
第一步：在build/utils/webpack.prod.conf.js 中的output中添加一条 publicPath:’./’在build/utils/webpack.prod.conf.js 中的output中添加一条 publicPath:’./'如果有则继续往下走，come on！！！ 没有的话看第二步 Vue-cli3.0文件配置Vue-cli3.0没有config文件，需要自己在
转载
2023-09-09 23:03:49
108阅读
vue-swiper/
├── src/
│ ├── components/ //内置组件
│ │ ├── indicator.vue // 指示器组件
│ │ └── item.vue // 单个轮播图容器组件
│ ├── main.js // 项目出口
│ └── main.vue //组件出口
├── README.md
├── package.jso
转载
2023-06-16 21:16:10
182阅读
Vue项目是一种流行的JavaScript框架，通常在开发过程中会对项目进行打包，将各种资源整合在一起以便部署到服务器上。但是有时候，我们希望能够将Vue项目部署到服务器上，而不需要事先打包。本文将介绍如何实现“vue项目不打包部署”，帮助初学者快速上手。
### 步骤概述
下面是实现“vue项目不打包部署”的整体步骤：
| 步骤 | 操作 |
| ------ | ------ |
| 1
原创
2024-05-17 14:13:31
581阅读
# 项目方案：Vue 如何打包部署 Docker
## 简介
在开发 Vue 项目时，我们通常会使用 Vue CLI 来进行打包和部署。而在部署的过程中，使用 Docker 可以帮助我们更好地管理项目的环境和依赖。本文将详细介绍如何将 Vue 项目打包并部署到 Docker 中。
## 流程图
```mermaid
flowchart TD
Start[开始] --> BuildVue
原创
2024-03-03 05:42:48
78阅读
# Vue应用打包部署到Docker的完整指南
随着Web应用程序的发展，Docker已成为一种重要的容器化技术。使用Docker，我们可以高效地管理应用程序的依赖项以及运行环境。本文将介绍如何将一个Vue.js应用程序打包并部署到Docker中，包括代码示例、甘特图和饼状图。
## 一、准备Vue应用
首先，我们需要一个基本的Vue.js应用。你可以通过Vue CLI来快速创建一个新的Vu
原创
2024-08-03 06:40:34
111阅读
# 如何将Vue项目打包部署到Nginx
## 简介
在开发完Vue项目后，需要将其打包并部署到生产环境中进行展示。Nginx是一个流行的Web服务器和反向代理服务器，可以帮助我们实现Vue项目的部署。
### 步骤概览
以下是将Vue项目打包部署到Nginx的整体步骤：
| 步骤 | 描述 |
| ------ | ------ |
| 1 | 打包Vue项目 |
| 2 | 部署Ngin
原创
2024-05-30 09:54:26
113阅读
Vue项目打包部署nginx是一个常见的操作，它可以帮助我们将Vue项目打包成静态文件，并通过nginx服务器进行部署，实现项目的发布和访问。在这篇文章中，我将教你如何完成这个过程。
首先，让我们通过以下步骤来了解整个过程：
| 步骤 | 操作 |
| ------ | ----------------
原创
2024-04-26 11:09:50
85阅读
使用Vue做前后端分离项目时，通常前端是单独部署，用户访问的也是前端项目地址，因此前端开发人员很有必要熟悉一下项目部署的流程与各类问题的解决办法了。Vue项目打包部署本身不复杂，不过一些前端同学可能对服务器接触不多，部署过程中还是会遇到这样那样的问题。本文介绍一下使用nginx服务器代理前端项目的方法以及项目部署的相关问题，内容概览：一、准备工作——服务器和nginx使用1. 准备一台服务器我的是
转载
2021-09-28 13:26:20
595阅读
原因：打包后的dist没有放到服务器的根目录下。解决方案：vue-cli官方文件给出的方法如下默认情况下，Vue CLI 会假设你的应用是被部署在一个域名的根路径上，例如 https://www.my-app.com/。如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 https://www.my-app.com/my-app/，则设置 publicPat
关于Vue打包踩坑问题的总结
转载
2021-07-02 10:38:04
233阅读
