![](https://img-blog.csdnimg.cn/8c376b5a56854daa8ca2486f274cf741.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
Vue2
文章平均质量分 50
Vue2项目相关的技术
James_liPeng
软件开发工程师,定期做技术分享
展开
-
Vue老项目性能优化
Vue老项目性能优化1. webpack版本的升级webpack 升级到4.x,性能可以提升60%2. Vue-cli的升级Vue-cli升级到3.0 性能可以提升30%左右3. dll的运用dllPlugin将vue, vuex, vue-route 等打入 vue-bucket.dll.js 内, 然后用DllReferencePlugin在webpack.base.conf.j...原创 2019-08-21 18:06:35 · 595 阅读 · 1 评论 -
vue2.0项目搭建步骤
vue项目搭建步骤第一步 node环境安装node的下载地址:https://nodejs.org/en/ (截止到2018/12/28时可用)第二步下载git 并安装git的下载地址https://gitforwindows.org/ (截止到2018/12/28时可用)第三步git 和node 的全局变量配置(这里不做详细的配置说明了可以参考https://ww...原创 2018-12-28 18:18:29 · 7758 阅读 · 1 评论 -
element-plus 从1.x测试版升级到2.x稳定版
1. 卸载项目里原来的element-plusnpm uninstall element-plus2. 安装最新的element-plusnpm install element-plus --save3. 在vue.config.js的configureWebpack参数中添加配置module: { rules: [ { test: /\.mjs$/, include: /node_modules/, type: "javascrip原创 2022-03-10 14:08:07 · 5955 阅读 · 5 评论 -
使用vue-cli4生成vue3代码
Vue3 使用心得前提更新Vue-cli脚手架(更新到最新版)卸载Vue-cli2卸载Vue-cli3安装 最新的脚手架前提本文主要是为有 Vue 2 经验的用户希望了解 Vue 3 的新功能和更改而提供的。更新Vue-cli脚手架(更新到最新版)卸载Vue-cli2npm uninstall vue-cli -g;卸载Vue-cli3npm uninstall -g @vue/cli安装 最新的脚手架npm install -g @vue/cli # OR yarn global a原创 2021-12-10 16:44:32 · 148 阅读 · 0 评论 -
使用Vite搭建vue3.0 + Naive UI 项目
使用Vite搭建vue3.0项目1. 使用NPM安装2. 安装2.1 输入项目名称选择要创建的框架(我们选择Vue)2.2 选择vue-ts 如下图所示2.3 按照指示进入创建的目录结构查看2.4 安装依赖2.5 启动2.6 启动成功3. 安装Naive UI3.1 使用webstrom3.2 安装Naive UI3.3 新建测试文件Test3.4 按需引入3.5 将Test组件使用到首页3.6 查看效果1. 使用NPM安装npm init @vitejs/app效果如下图:2. 安装2.1 输原创 2021-06-13 01:58:08 · 5413 阅读 · 5 评论 -
我常用的代码优化技巧
分享一下项目内code review的过程中总结出的一些前端开发经常容易忽略的地方,这篇仅列出基础的情况。1. 多表达式多 if 判断我们可以在数组中存储多个值,并且可以使用数组include方法。// 长if (x === 'abc' || x === 'def' || x === 'ghi' || x ==='jkl') { //todo}// 短if (['abc', 'def', 'ghi', 'jkl'].includes(x)) { //todo}2. 简写 if else原创 2021-02-04 14:45:05 · 170 阅读 · 0 评论 -
Springboot项目与vue项目整合打包
后端:准备工作:安装JDK配置环境变量安装IDEA一. 在IDEA中新建SpringBoot项目点击File -> new -> Project然后选择Spring initializr, 之后选择自己的JDK, 我测试安装的是12.0版本, 一般开发使用的是1.8稳定版选择好相应的JDK之后点击next, 根据个人需求进行相应的修改, 然后next然后选择...原创 2019-08-18 11:33:19 · 11645 阅读 · 2 评论 -
vue-cli4搭建项目
使用Vue-Cli 4.x脚手架项目初步搭建1. 前提:node的版本要在8.11.0+2. 如果之前电脑中安装多其他版本的脚手架需要卸载掉其他的版本, 重新安装4.x版本**npm uninstall -g vue-cli**3. 安装最新版本脚手架npm install -g @vue/cli# ORyarn global add @vue/cli安装后查看脚手架的版本...原创 2020-02-22 20:58:57 · 843 阅读 · 0 评论 -
vuecli2升级到vuecli3
vuecli2升级到vuecli31. 卸载老版本vuecli(1.x, 2.x)npm uninstall vue-cli -g或者yarn global remove vue-cli卸载掉之前的老的版本的vuecli2. node安装最新版本的(8.x)3. 安装最新的vueclinpm install -g @vue/cli4. 查看已经安装的版本号vue --ve...原创 2019-09-26 10:41:48 · 873 阅读 · 0 评论 -
老vue项目升级到webpack4.x
vue项目升级到webpack4.x有些老项目在开发了一段时间之后会出现项目越来越慢, 以及打包时间过长, 加载时间变成等问题,如果我们讲项目中的webpack升级到4.x项目的性能至少可以提升到百分之六十第一步骤:删除 build/config第二步:package.json“scripts”: {“dev”: “vue-cli-service serve”,“build”: “v...原创 2019-07-27 13:51:47 · 642 阅读 · 1 评论 -
Vuex起步 - - Vuex和全局对象的区别
Vuex起步 - - Vuex和全局对象的区别每一个 Vuex 应用的核心就是 store(仓库)。“store”基本上就是一个容器,它包含着你的应用中大部分的状态 (state)。Vuex 和单纯的全局对象有以下两点不同:Vuex 的状态存储是响应式的。当 Vue 组件从 store 中读取状态的时候,若 store 中的状态发生变化,那么相应的组件也会相应地得到高效更新。你不能直接改变...原创 2019-02-26 13:52:57 · 1763 阅读 · 0 评论 -
Vue2.0使用Axios实现跨域访问(解决跨域问题)
Axiso实现跨域访问配置BaseUrl在main.js中,配置下我们访问的Url前缀:axios.defaults.baseURL = '/api' // 开发本地代理axios.defaults.headers.post['Contenst-Type'] = 'application/json;'axios.defaults.headers.common['token'] = s...原创 2019-01-09 14:30:18 · 8213 阅读 · 2 评论 -
使用Vue2.0在http请求头中添加token(详解含代码)
使用Vue在http请求头中添加token用到的技术:Vue, Vue-router, axios, Vuex1.在Login.vue中通过发送http请求获取token//根据api接口获取token submitForm (formName) { this.$refs[formName].validate(valid => { if (valid) {...原创 2019-01-09 11:02:34 · 27398 阅读 · 3 评论 -
vue2.0 中引入和使用 axios
vue2.0 中引入和使用 axios原创 2019-01-03 10:18:41 · 3468 阅读 · 1 评论