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
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
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
vue搭建准备环境npmnodewebpackvs codenpm使用brew命令行进行下载安装指定版本：brew install npm查看版本号：$ npm -v
8.15.0Node进入官网nodejs，根据自己电脑的版本进行下载安装，如果是mac电脑，可以直接使用brew命令行进行下载。 安装指定版本号：brew install node@16安装完成后，使用node -v的命令查看版本号
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
368阅读
前言vue3已经正式发布有一段时间了，本着学习使人进步的原则，就开始了vue3的实践之路。vue3推出了一个web开发构建工具vite，那就放弃使用vue-cli尝尝鲜吧。vue3项目也是用了typescript，并且现在ts也很火，就正好一起实践一下。准备工作 确保安装了node开始1、项目初始化npm init vite-app my-vue3此时项目就已经初始化好，并且可以正常运行了。cd
vue3 工程结构分析 vm vs app前言主要内容1 工程结构分析1.1 图示1.2 叙述2 vue3工程结构2.1 app与vm2.2 App.vue2.3 语法检查summary前言这篇文章的相关知识在vue3第一幕基础与起步中有过提及，本文相当于是对它的补充，侧重点在vue2的vm与vue3的app。本文是vue3知识的一部分，主要内容是vue3的工程结构分析。文章会给出工程结构图和具
项目的创建vue3中vuecli的包修改为@vue/cli，vue创建的项目命令修改为vue create，用来快速创建新项目。因为项目开发中需要vuecli，所以我们需要全局安装，下面中的-g表示全局安装，install也可以简写为i。安装完成后，我们可以通过vue --versioon检查是否安装成功。除了npm安装外，我们也可以使用yarn
原创
精选
2022-05-24 21:11:11
2535阅读
Vue3项目整合Electron第一步安装：VUE3安装vue3脚手架npm install -g @vue/cli安装 yarn，并设置淘宝源npm install -g cnpm --registry=https://registry.npm.taobao.org设置ELECTRON_MIRROR,加速electron的预编译npm config set ELECTRON_M...
原创
2022-12-19 13:51:20
551阅读
文章目录Vite创建Vue3项目1. 输入项目名称2. 选择框架3. 选择不同的vue4. 项目创建完成5. 项目结
原创
2022-07-20 06:38:14
3737阅读
一. 代码规范1.1 集成editorconfig配置EditorConfig有助于为不同IDE编辑器上维护一致的编码风格安装插件：EditorConfig for VS Code 后会读...
原创
2022-06-29 20:47:16
439阅读
目录1、Input 输入框2、Table 表格3、Tree 树形控件4、Pagination 分页5、Dialog 对话框6、ECharts 图表7、wangEditor 富文本编辑器整理一下自己在 Vue2 项目中常用到的一些封装组件 ：大部分是结合 element-ui 组件库 进行的二次封装 ：饿了么组件库 => Element - The world
# Vue3项目使用TypeScript
## 概述
在本文中，我将向你介绍如何在Vue3项目中使用TypeScript。Vue3是一种流行的JavaScript框架，而TypeScript是一种类型安全的JavaScript超集。结合使用Vue3和TypeScript可以提供更好的开发体验和代码质量。
## 步骤
下面是实现Vue3项目使用TypeScript的步骤：
| 步骤 | 描述
原创
2023-08-03 07:34:47
249阅读
环境安装npm安装： 1.安装最新版nodejs 2.win+R cmd 输入node -v，我这里安装的是v14.17.0cnpm安装： 3.安装淘宝镜像npm install -g cnpm registry=https://registry.npm.taobao.orgVue安装： 4.继续安装vue脚手架cnpm i -g @vue/cli（删除之前老的脚手架工具 npm uninstal
1 Vite项目目录 用Vscode打开创建的项目，看到下面的目录结构： 通过运行 npm install 初始化项目后生成两个初始化文件：node_modules和 package-lock.json2 SFC 语法规范*.vue 件都由三种类型的顶层语法块所组成：<template>、<script>、<style><t
转载
2023-08-07 23:55:48
266阅读
文章目录一、环境准备二、核心组件2.1. axios封装2.2. vuex2.3. vue-router一、环境准备前提：# 安装node环境node -vnpm -
原创
2022-09-05 22:11:44
260阅读
文章目录创建vue3项目使用vue cli创建使用vite创建分析目录结构安装开发者工具创建vue3项目使用v
原创
2022-06-06 12:31:26
709阅读
# 用Vue-CLI 创建Vue 3 项目
Vue.js 是一个流行的 JavaScript 框架，而 Vue-CLI 则是官方提供的脚手架工具，可以帮助我们快速搭建 Vue 项目。在本篇文章中，我将教大家如何使用 Vue-CLI 创建一个 Vue 3 项目。
## 步骤概览
在下面的表格中，我将展示创建 Vue 3 项目的基本步骤：
| 步骤 | 描述 |
| :--- | :--- |
