前言背景：2019年2月6号，React 发布 「16.8.0」 版本，vue紧随其后，发布了「vue3.0 RFC」Vue3.0受React16.0 推出的hook抄袭启发(咳咳...)，提供了一个全新的逻辑复用方案。使用基于函数的 API，我们可以将相关联的代码抽取到一个 "composition function"(组合函数)中 —— 该函数封装了相关联的逻辑，并将需要暴露给组件的状态以响应
快捷导航vue3.x的新特性研究vue2.x面临的问题vue3.x的主要优势vue3.x写法变动Vue Function-based API RFC1. setup()2. state 的设定包装对象**ref()**附加的 reactive()3. computed4. watch5. prop6. 生命周期与 react hooks 对比 vue3.x的新特性研究本文仅作为vue3.x的研究
cli 方式安装 集成了内置webpack 模块安装步骤 1、全局安装 vue-cli$ npm install --global vue-cli 2、 创建一个基于 webpack 模板的新项目$ vue init webpack my-project3、安装依赖，走你$ cd my-project
$ npm i
转载
2024-10-14 17:51:28
204阅读
NPM命令详解如果你打开的是别人的项目，这个时候一般是没有任何依赖包的，但是所以需要的包已在package.json里面写好了，这个时候我们就可以使用npm install来安装所有项目中需要的依赖包了更新到最新版本 npm install -g npm平时工作中经常用npm安装，每次用的时候有些命令都要去查一次，这次就自己把这些命令整理下，让自己可以多记住一些。 对于还不知
全局安装：检查版本：pnpm -v创建vue3项目：项目装包：运行项目：pnpm dev命令行：pnpm 人工智能学习网站。
原创
2024-06-16 21:42:29
308阅读
参考资料一、安装node环境 1、下载地址为：Node.js 2、检查是否安装成功：如果输出版本号，说明我们安装node环境成功 3、为了提高我们的效率，可以使用淘宝的镜像：中国 NPM 镜像 输入：npm install -g cnpm –registry=https://registry.npm.taobao.org，即可安装npm镜像，以后再用到npm的地方直接用cnpm
转载
2024-09-20 20:36:06
314阅读
一.快速上手Vue31.使用Vue3的CDN<script src="https://lib.baomitu.com/vue/3.0.2/vue.global.js"></script>2.vue-cli升级到vue-cli v4.5 (删除后再安装)npm i -g @vue/cli@next3.使用Vite利用ES6的import会发送请求去加载文件的特性，拦截这些请求
在 pnpm 中，您可以通过设置 registry 来指定镜像源。可以使用以下命令来指定镜像：pnpm install --registry=<镜像地址>例如，如果您想使用淘宝镜像：pnpm install --registry=https://registry.npmmirror.com如果您希望永久设置某个镜像源，可以通过 pnpm config 命令来进行配置：pnpm conf
安装淘宝镜像npm install -g cnpm --registry=https://registry.npm.taobao.org永久使用npm config set registry https://registry.npm.taobao.org配置CNPM这样的话，你用npm走的还是官方的，cnpm走的代理npm install -g cnpm --registry=https://re
# 使用Docker构建Vue3镜像
在当今的软件开发中，使用Docker容器化技术可以帮助开发人员更轻松地构建、交付和运行应用程序。Vue.js是一种流行的JavaScript框架，它可以帮助我们快速构建交互式的Web应用程序。在本文中，我们将介绍如何使用Docker构建Vue3的镜像，以便于在不同环境中轻松部署Vue3应用程序。
## 准备工作
在开始之前，我们需要确保已经安装了Dock
原创
2024-05-19 03:22:07
252阅读
前端需要不断学习进步，fighting！1、首先需要安装环境vue install -g vue@cli【vue需要是3.0以上版本，通过vue --version验证】2、通过命令行创建新项目，vue3.0创建项目的命令行与之前有所不同vue init webpack 【项目名】//之前的命令行
vue create 【项目名】//vue3.0创建项目的命令行，简单明了3、选择项目配置：选择配置
如果想在页面初始化时渲染动画效果，此时需要用到appear呈现属性和appear-active-class呈现过渡属性，语法如下过渡+动画如果想在元素过渡的同时添加动画效果，此时又需要用到enter-active-class和leave-active-class属性步骤1、添加过渡类名+动画名，这里为了方便查看效果，我将动画改为swing抖动
2、设置transition过渡属性值一般为了效果执行
本人已经使用vue.js半年多了，在作一些Html5页面的时候发现不少页面都是图片组成的，若是能有效的压缩图片的体积那么整个项目体积就会减小不少，这是为何写这个简单东西的起点。vueWebp 百度百科上已经讲清楚在保持原画质的状况呀体积能够压缩到原来的60%这是很牛逼的一件事。看看webp的兼容状况，下图是caniuse上面最新的webp支持状况webpack兼容状况仍是不那么乐观，不过chrom
作者：FinGet创建项目 image.png
基础语法定义datascript标签上lang="ts"定义一个类型type或者接口interface来约束data可以使用ref或者toRefs来定义响应式数据使用ref在setup读取的时候需要获取xxx.value,但在template中不需要使用reactive时，可以用toRefs解构导出，在template就可以直接使用了&l
vue-cli3 配置多环境打包近期由于公司项目需要在本地服务器和阿里云服务器两个地方搭建项目，因为本地服务器是内网无法访问在阿里云的微服务接口所以需要用到多环境配置，所以就研究了一下vue-cli3的多环境配置。环境变量丨模式首先我们先看看 vue-cli环境变量和模式，通过官网我们可以发现 vue-cli 提供了三个模式(test、development、production)而每种NODE_
转载
2024-10-18 09:40:34
64阅读
在开发现代 Web 应用时，使用 Vue 3 和 Axios 进行 API 通信已成为行业标准。在某些情况下，我们需要指定不同的服务端口来处理不同的请求。本文将详细阐述如何在 Vue 3 中使用 Axios 指定端口，包括版本对比、迁移指南、兼容性处理、实战案例、排错指南以及性能优化。
## 版本对比
Vue 3 和 Axios 在相关 API 的设计上对比了几个特性差异，主要集中在请求处理的
1： vue 3.0 新特性 数据响应式数据重现（由ES6的proxy 替换ES5的Object.defineProperty）2: 源码使用typeascript 重新编写）（更好的类型推断）3： VDOM 新算法（更快， 高小）；4： 提供了composition API, 为了更好的逻辑复用和代码组织5： Fragment： 模板可
Vue 提供了 transition 的封装组件，在下列情形中，可以给任何元素和组件添加进入/离开过渡:条件渲染 (使用 v-if)条件展示 (使用 v-show)动态组件组件根节点自定义 transition 过度效果，你需要对transition组件的name属性自定义。并在css中写入对应的样式1.过渡的类名在进入/离开的过渡中，会有 6 个 class 切换。#过渡 class在进入/离开
转载
2024-10-27 10:12:14
95阅读
一：下载node.js搭建vue开发环境之前，官网选择下载node.js。vue的运行是要依赖于node的npm的管理工具来实现。二：安装node.js一路 “下一步”操作，安装node。打开dos系统，查看node安装成功与否。输入node -v回车，成功即显示node的版本信息 npm包管理器，是集成在node中的，即安装了node也就有了npm,输入npm -v命令，显示npm的版
转载
2024-05-09 22:40:01
1518阅读
一、环境搭建 1、软件安装: Node.js > npm > vue.js2、Node.js的安装。 (1) 先从官网下载node.js，官网地址：https://nodejs.org/en/，除了更改安装路径，其他的直接默认“下一步”就可以。(2) 安装完成后， cmd窗口，在窗口中输入命令： node -v 出现nodejs的版本号则安装成功（注意是新开一个cmd窗口）。(3) 在
转载
2024-03-17 23:10:46
37阅读
