须知本文部分内容参考以下链接：blog.fundebug.com/2018/06/08/…步骤1、安装 Vue-CLInpm install -g @vue/cli
# OR
yarn global add @vue/cli
复制代码参考：cli.vuejs.org/zh/guide/in…2、用 Vue-CLI 创建项目定位到上级目录，创建 Vue-CLI 项目。新建或者覆盖都可以vue cre
vue3项目打包默认情况下npm run build后会将文件打包到dist目录下，其中dist/index.html是首页从上面我们可以知道资源都是以/进行访问，我们使用vscode的live server插件后打开发现资源出现问题，访问地址为：http://127.0.0.1:5500/demo/dist/index.html资源从/加载的话会将协议://域名：端口进行拼接导致我们的资源出现异
转载
2023-07-18 21:37:04
434阅读
准备（1）首先是一个Vue项目。（2）其次准备好服务器（在这里我是用虚拟机VMware）。（3）准备好一个SpringBoot后端代码。（4）服务器上必须安装Nginx。1、前端代码注意事项：（1）在这里我是用vuecli3脚手架创建的vue项目的，所以项目创建完毕之后是没有vue.config.js的。 其实这个文件的创建是为了本地测试解决前后端跨域问题的，但是在打包项目的时候需要把这里关于跨域
转载
2024-03-02 09:46:25
417阅读
yarn 打包 vue3 项目的过程
在当今的前端开发中，Vue 3 的流行程度不容小觑，它的轻量且高效的特点使得各种业务场景都能得以实现。随着业务的发展，有效的项目打包就显得尤为重要。以下是关于使用 `yarn` 打包 Vue 3 项目的详细过程记录。
### 背景定位
在快速发展的互联网公司中，业务场景越来越复杂，尤其是在用户访问量的持续增长下，系统的响应速度及打包策略需要进行优化。项目
一、 There are multiple modules with names that only differ in casing.这个情况是如果多出引用的组件 有一个地方的引用地址的大小写肯定是写错了 检查一下二、vue渲染iconfontvue渲染iconfont的时候，用unicode。四、预览打包后的文件vue-cli打包build出来的dist文件夹，如果直接用本地文件的形式打开，是
问题：我提交到服务器之后执行了 npm run dev之后关闭了是可以打开网页的，但是关闭了ssh之后，服务马上就不能用了，请问正确的部署方式是怎么样的？答：感觉好多人把最基本的都忘了还npm run dev还守护进程,用守护进程也应该你自己用nodejs实现一个web静态服务器而不是去守护npm run dev楼主问的既然是布署，哪默认就应该是生产环境下的布署，vue开发的应用本质上就是静态文件
转载
2024-10-18 22:33:27
57阅读
VUE3小结1、Vue3.0环境集成1.使用vue-cli创建2.使用vite创建2、常用的Composition API（组合API）1、setup函数2、ref函数3、reactive函数4、Vue3.0中的响应式原理7、监听属性10、自定义事件11、属性传值13、占位组件Suspense和异步组件14、注册组件（八种方式）15、isRef toRef toRefs（响应式数据解构）16、r
转载
2024-06-28 19:03:32
168阅读
Vue3.0的六大亮点：Performance：性能比 Vue2.x 快 1.2~2 倍Tree shaking support：按需编译，体积比 Vue2.x更小Composition API：组合API(类似 React Hooks)Better TypeScript support：更好的 Ts 支持Custom Renderer API：暴露了自定义渲染APIFragment，Telepo
转载
2024-01-29 00:53:55
110阅读
1. Vue2.x 和 Vue3.x 生命周期方法的变化文档地址：https://v3.cn.vuejs.org/guide/composition-api-lifecycle-hooks.htmlVue2.x 和 Vue3.x 生命周期方法的变化蛮大的，先看看：2.x 生命周期3.x 生命周期执行时间说明beforeCreatesetup组件创建前执行createdsetup组件创建后执行bef
转载
2023-11-27 01:50:54
188阅读
首先下载nginx,进行最小化配置用vscode 打开nginx.conf文件在http模块的server模块里进行配置listen 字段监听端口号 http的默认端口号是80(nginx的端口号可以随便写)server_name字段 是ip地址 lochhost就是127.0.0.1lacation 字段 是在浏览器的地址栏http协议+ip地址+端口号后面的url在location字段里进行配
接下来就来正式实战,看看docker怎样去部署一个Vue前后端分离的项目，我们从以下三点来进行：Vue项目打包Docker镜像后端项目Nginx的配置一. Vue项目打包这里说下,我服务器本身就有Nginx服务,所以我只需要将Vue项目进行打包然后上传到服务器,Nginx能访问到即可,并未使用到Docker进行构建1.1 通过命令打包进到项目根目录然后执行打包命令cd 项目根目录npm run b
转载
2024-10-23 17:03:05
348阅读
# Vue3项目使用Yarn打包
## 简介
Vue是一套用于构建用户界面的渐进式JavaScript框架，它使用了虚拟DOM来更新DOM，使得应用程序更加高效和响应迅速。Vue3是Vue框架的下一个主要版本，它引入了许多新的特性和改进。
在Vue3项目中，我们可以使用Yarn作为包管理器来管理我们的依赖项并进行打包。Yarn是一个快速、可靠和安全的包管理器，它具有与NPM相似的命令和功能，
原创
2023-11-25 13:36:09
350阅读
vue搭建准备环境npmnodewebpackvs codenpm使用brew命令行进行下载安装指定版本：brew install npm查看版本号：$ npm -v
8.15.0Node进入官网nodejs，根据自己电脑的版本进行下载安装，如果是mac电脑，可以直接使用brew命令行进行下载。 安装指定版本号：brew install node@16安装完成后，使用node -v的命令查看版本号
转载
2024-08-29 21:30:56
282阅读
场景 在开发过程中，通常会遇到这样的问题：在开发环境、测试环境和生产环境中我们会用到不一样的服务接口 在生产环境出现了出现了某个bug，但是在测试环境不存在，这时候就需要开发环境访问生产环境的接口 多端一体的项目模式 这些情况都要手动去切换接口地址，这样会很麻烦，有时还可能出现操作失误。这时候就需要用到cross-env进行分环境配置了，根据不同的环境，我们使用对应的接口，这样也就不用手动去操作。
转载
2024-05-09 11:02:51
306阅读
前言咱辛辛苦苦用typescript写个组件库为了啥？不就是为了方便开发嘛。通过npm实现一键安装，下载即玩✨(bushi允许按需加载组件，打包大小 down down down ?!!!通过ts轻轻松松获取代码提示，写代码直接tab tab tab ?…最后实现的效果是：main.js 引入 当然按需引入也是支持的.vue文件使用：项目结构sss-ui-plus-master
├─ exampl
转载
2024-10-18 06:59:49
126阅读
近几年一直嚷着前后端分离很火，一直没时间研究，今天终于找出时间研究了，奈何down了开源项目却无法运行，真真是尴尬至极。 down的项目是vue的，之前一直没用过，所以先从搭建环境开始1、首先下载安装node.js开始也不解为啥用vue需要node.js
转载
2024-07-10 21:56:45
152阅读
这里 我的接口是写在 http://localhost:80上的 接口名是user 需要一个id路径参数 我们知道 80是默认 所以就可以不带端口因此访问就是http://localhost/user/1 然后 我vue项目中的 vue.config.js 配置如下const { defineConfig } = require('@vue/cli-service')
module.exports
# Vue 3 项目架构解析
Vue.js 是一个流行的前端框架，广泛应用于开发现代化的单页应用（SPA）。随着 Vue 版本的迭代，Vue 3 引入了许多新特性，使得构建组件化和可维护的应用变得更加简单。本文将详细讲述 Vue 3 项目架构的组成部分，并通过代码示例解释如何实现它。
## 一、项目构建
使用 Vue CLI 创建项目是最常见的方式。以下是创建 Vue 3 项目的命令：
`
vue3项目快速开发模板简介本项目采用 vue3 + webpack 的方式来开发，已经引入了常用功能，不需要再去配置路由、请求、pinia 等，上手直接开发页面即可，真正做到开箱即用你可以直接拉取我的仓库来直接使用，也可以按照本文教程自己操作技术栈vue3webpackpiniavue-router4element-plusaxiosi18nsass启动项目安装npm install运行npm
创建vue3项目
原创
2024-05-16 11:01:57
76阅读
