vue2和vue3常用安装命令--仅供参考 版本根据需要调整

最新推荐文章于 2024-09-04 15:29:17 发布
最新推荐文章于 2024-09-04 15:29:17 发布
阅读量664 收藏 1
点赞数
分类专栏： Vue 文章标签： vue.js npm
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/beiback/article/details/129637667
版权
该文详细列举了Vue项目的安装步骤，包括vue-cli的使用，vue-router、vuex、axios等关键库的安装，以及element-ui和element-plus的安装与卸载。还提到了Vue配置，如代理服务器设置和样式支持，以及typescript的集成。
摘要由CSDN通过智能技术生成 
1.项目的安装
cnpm  install  或者 npm install

vue create vuetest2

注意：vue2只能用3版本得路由！！！执行这段命令安装npm i vue-router@3
vuex
注意：vue2只能用3版本得vuex 

Vue 注册淘宝境像
npm config set registry https://registry.npm.taobao.org

npm i vue-router@3.0.1

npm install vue @3.0.1

npm install vuex@3.0.1 --save

npm install axios -S
npm install --legacy-peer-deps axios -S

npm install --legacy-peer-deps less-loader@6 -S

npm install less-loader@6

npm install axios@0

安装  进度条  
npm install  --save  nprogress@0 
安装 vuex
cnpm install --save vuex@3
安装 mockjs@1
cnpm install --save  mockjs@1
安装swiper
cnpm i --save swiper@5
安装element- ui
npm i element-ui@2 -s
安装二维码生成器
npm i qrcode@1.4.4   -s
安装图片懒加载
npm i vue-lazyload@1.3.3 -S
安装表单验证
npm i vee-validate@2.2.15 --save



npm install -g typescript
安装element ui   ---别忘界面版本安装typescript  或者命令安装 否则无法使用 <script lang = "ts">
npm i element-ui -S
npm install --legacy-peer-deps element-ui --save
npm install --legacy-peer-deps element-plus --save
npm install --force element-ui --save
vue3以上的element命令安装 
npm install element-plus --save

卸载两个   element ui 
npm uninstall element-ui --legacy-peer-deps
npm uninstall element-plus  --legacy-peer-deps 

npm install element-plus --save

图标
npm install @element-plus/icons-vue



https://www.cnblogs.com/zwp06/p/13959511.html

import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
createApp(App).use(store).use(router).use(ElementPlus).mount('#app')

=======================================


所在文件夹 cmd

vue create vuetest2(命令行创建文件夹)

支持样式 <style lang="less"  scoped>
npm i less-loader@6 

npm i vue-router@3.0.1

npm install vue @3.0.1

npm install vuex@3.0.1 --save

vue3 放弃安装 axios？？
npm install axios -S   

vue3以上的element命令安装 
element-plus
npm install element-plus --save


图标
npm install @element-plus/icons-vue


npm install --legacy-peer-deps element-ui --save
npm install --force element-ui --save



如何卸   element ui 
npm uninstall element-ui --legacy-peer-deps
npm uninstall element-plus  --legacy-peer-deps 


https://www.cnblogs.com/zwp06/p/13959511.html

import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
createApp(App).use(store).use(router).use(ElementPlus).mount('#app')




<el-icon><Message /></el-icon>



babel。config0


这里的参数要写成home/categoryList不然会报错

要开命名空间，并且：this.$store.dispatch('home/categoryList', 'categoryList')
module.exports = {
  presets: [
    '@vue/cli-plugin-babel/preset'
  ]
}


run dev失败的可以 在安装一下 cnpm i -S core-js


1.项目的安装
cnpm  install  或者 npm install

2.项目启动关注 package.json
"dev": "vue-cli-service serve",     npm  run dev
"serve": "vue-cli-service serve",   npm  run serve

3.关注二次封装axios
request.js

4.关注代理服务器的设置
    proxy: {
      '/dev-api': {
        target: 'http://39.98.123.211',
        pathRewrite: { '^/dev-api': '' },
      },
    },

	


https://www.bilibili.com/video/BV137411B7vB/?p=2&spm_id_from=333.1007.top_right_bar_window_history.content.click

https://www.kancloud.cn/wsj-/vue/652843


vue create vuetest2
注意：vue2只能用3版本得路由！！！执行这段命令安装npm i vue-router@3

Vue 注册淘宝境像
npm config set registry https://registry.npm.taobao.org

npm i vue-router@3.0.1

npm install vue @3.0.1

npm install vuex@3.0.1 --save

npm install axios -S
npm install --legacy-peer-deps axios -S

npm install --legacy-peer-deps less-loader@6 -S

npm install less-loader@6

npm install axios@0

安装  进度条  
npm install  --save  nprogress@0 
安装 vuex
cnpm install --save vuex@3
安装 mockjs@1
cnpm install --save  mockjs@1
安装swiper
cnpm i --save swiper@5
安装element- ui
npm i element-ui@2 -s
安装二维码生成器
npm i qrcode@1.4.4   -s
安装图片懒加载
npm i vue-lazyload@1.3.3 -S
安装表单验证
npm i vee-validate@2.2.15 --save



npm install -g typescript
安装element ui   ---别忘界面版本安装typescript  或者命令安装 否则无法使用 <script lang = "ts">
npm i element-ui -S
npm install --legacy-peer-deps element-ui --save
npm install --legacy-peer-deps element-plus --save
npm install --force element-ui --save
vue3以上的element命令安装 
npm install element-plus --save

卸载两个   element ui 
npm uninstall element-ui --legacy-peer-deps
npm uninstall element-plus  --legacy-peer-deps 

npm install element-plus --save

图标
npm install @element-plus/icons-vue



https://www.cnblogs.com/zwp06/p/13959511.html

import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
createApp(App).use(store).use(router).use(ElementPlus).mount('#app')

=======================================


所在文件夹 cmd

vue create vuetest2(命令行创建文件夹)

支持样式 <style lang="less"  scoped>
npm i less-loader@6 

npm i vue-router@3.0.1

npm install vue @3.0.1

npm install vuex@3.0.1 --save

vue3 放弃安装 axios？？
npm install axios -S   

vue3以上的element命令安装 
element-plus
npm install element-plus --save


图标
npm install @element-plus/icons-vue


npm install --legacy-peer-deps element-ui --save
npm install --force element-ui --save



如何卸   element ui 
npm uninstall element-ui --legacy-peer-deps
npm uninstall element-plus  --legacy-peer-deps 


https://www.cnblogs.com/zwp06/p/13959511.html

import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
createApp(App).use(store).use(router).use(ElementPlus).mount('#app')




<el-icon><Message /></el-icon>



babel。config0


这里的参数要写成home/categoryList不然会报错

要开命名空间，并且：this.$store.dispatch('home/categoryList', 'categoryList')
module.exports = {
  presets: [
    '@vue/cli-plugin-babel/preset'
  ]
}
退无可退而立版
关注
专栏目录
【Vue】 Vue3 安装说明，适合小白新手
wjianwei666的专栏
09-04 1891
独立版本我们可以在 Vue.js 的官网上直接下载最新版本, 并用下载 Vue.js https://unpkg.com/vue@next2、使用 CDN 方法以下推荐国外比较稳定的两个 CDN，国内还没发现哪一家比较好，目前还是建议下载到本地。Staticfile CDN（国内） : https://cdn.staticfile.org/vue/3.0.5/vue.global.js。
〖Python 数据库开发实战 - MySQL篇⑧〗- MySQL的配置文件与常用的配置方案
热门推荐
易编橙 · 终身成长社群，相遇已是上上签！
07-17 4万+
今天这一章节，我们来讲解一下 MySQL 的配置文件。既然开始写数据库的学习章节，就不能简单的讲一下 "增、删、改、查" ，再讲讲 "创建索引"、"回滚事务"等等。 学数据库就要学明白，毕竟将来是靠技术赚钱的。要学习明白怎么用，怎么配置，学懂学透彻了；当然了 MySQL 的配置有上百个，所以这里会挑选其中最重要的一些参数给大家介绍一下，其他的参数等到用到的时候再来介绍吧。...
VUE-2:vue安装
ggg21534的博客
02-26 222
5. 输入cd .\vue-project(文件名)\ 回车 输入clear。2. 打开终端，输入npm init vue@latest。可修改文件名（vue-project）下载完之后在执行npm run dev。因为没有下载什么 再输入npm i。ls 和 clear 交替输入几遍。然后输入npm run dev。得到一个网站 可以打开。
vue3.0搭建全教程
最新发布
qq_41729329的博客
09-04 2195
123123。
vue——安装以及命令
angryshan的博客
11-30 6254
一、安装node 在https://nodejs.org/en/download/下载，并安装 二、查看是否安装成功，打开cmd 1.查看版本命令：npm -v 2.升级 npm命令：cnpm install npm -g   （npm 版本需要大于3.0，如果小于3.0，则需要升级） 3.升级或安装cnpm命令：npm install cnpm -g  4.安装vue:c...
安装Vue过程中用到的命令
llqer的博客
07-20 450
版本不符到官网https://nodejs.org/en/下载合适的版本。出现错误可以重新安装试试。
vue安装指令
koko_pe的博客
09-23 283
全局安装脚手架工具vue-cli npminstall --global vue-cli 安装webpack npm install -g webpack 运行项目 npm run dev ***持续更新中***
3. 如何快速搭建开发环境并让应用跑起来(脚手架Vue-CLI)
qq_43456781的博客
07-26 485
3. 当新入职一家公司时，如何快速搭建开发环境并让应用跑起来 文章目录3. 当新入职一家公司时，如何快速搭建开发环境并让应用跑起来3.1 回答3.2 脚手架Vue-CLI3.2.1 该系统的组件3.2.2 CLI3.2.3 CLI 服务3.2.4 CLI 插件3.3 npm run dev 与 npm start 的区别3.3.1 纯静态页面打包3.3.2 面向服务端的项目3.4 CI/CD3.4.1 CI 是什么？CI 和 CD 有什么区别？3.4.2 CI 持续集成（Continuous Integra
Vue快速入门学习笔记(更新ing)
喜欢前端的后端 MelodyJerry
11-15 4212
原在博客园发布，先同步到CSDN：https://www.cnblogs.com/melodyjerry/p/13768594.html 本笔记综合了视频狂神说的Vue快速上手和菜鸟教程、CSDN等博客文章，以及个人的一些学习见解与体会。 由于是为了团队需要而快速入门，HTML、CSS、JS、Vue等基础均不全，故本笔记仅供参考学习使用。 Vue 的核心库只关注视图层，方便与第三方库或既有项目整合。 HTML + CSS + JS : 视图 ： 给用户看，刷新后台给的数据 网络通信 ： axios.
（附源码）ssm+vue.js+mysql+基于ssm店铺评价系统设计与实现 毕业设计201524
Weixin_CXSJ881的博客
03-20 2272
店铺评论系统主要功能模块包括站点管理（轮播图、公告栏）、用户管理（管理员）、内容管理（文章、文章类型）、更多管理(学生、商家、商品信息、购物车)，采取面对对象的开发模式进行软件的开发和硬体的架设，能很好的满足实际使用的需求，完善了对应的软体架设以及程序编码的工作，采取MySQL作为后台数据的主要存储单元，采用SSM框架、Java技术、Ajax技术进行业务系统的编码及其开发，实现了本系统的全部功能。本次报告，首先分析了研究的背景、作用、意义，为研究工作的合理性打下了基础。针对店铺评论系统的各项需求以及技术问题
前端面试题知识点总结（仅供参考）
jiang16608544720的博客
03-14 1829
以下是本人面试后总结出来的面试知识点： 1.1. 模块化 \1. ES6 \2. Commonjs 1.2. 构建工具 \1. Webpack核心思想：模块化打包 \2. Webpack基本配置: entry, output, module&rules, plugins, devServer, devtool, resolve \3. 打包各种资源: JS / CSS/img/html/… \4. 加分项: 自定义webpack打包环境, Webpa
安装指定vue-router指定版本
qq_66440988的博客
01-26 2310
1、首先运行新终端 2、运行此命令 npm i vue-router@3.2.0
vue2和vue3的安装
qq_67035012的博客
07-23 418
安装前准备：安装node.jsnpm install -g vue-cli 安装vue脚手架创建项目或 yarn global add @vue/cliyarn servenpm install (或 yarn)npm run dev (或yarn dev)卸载vue3 将vue-cli换 @vue/cli或 yarn global remove vue-cli或 yarn global upgrade --latest vue-cli。
Vue2 的安装
qq_59028899的博客
07-14 516
Vue的安装根据需求分为 script标签引入 与 npm命令创建项目 两种安装方式。
Vue2----安装与使用常用指令
没有途径，只有努力
02-26 649
目录 Vue2的安装 Vue2的语法 常用指令 Vue2 Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。 官网:https://cn.vuejs.org/ 语法 app不能挂载到body,html上 el 元素挂载位置 data 模型数据,可多个 {{}} 插值表达式(有运算功能) vue执行原理?? vue----框架
vue3 常用插件安装命令
qq_44751183的博客
08-08 441
【代码】vue3 常用插件安装命令。
Vue脚手架（安装vue2/vue3）
haonan_z的博客
03-30 2267
一、node、npm安装及使用 1、安装node、npm 直接在官方网站中下载安装 安装完成检查是否安装成功 node -v npm -v 使用taobao镜像（新镜像）加速 npm install -g cnpm --registry=https://registry.npmmirror.com 2、安装vue-cli2 卸载vue3.X+（如果安装过） npm uninstall -g @vue/cli 安装vue2 npm install vue-cli -g 检查是否安装成功 vue -V
vue2 添加vue-router3
qq_40243950的博客
02-07 521
引入并使用vue-router3
vue 安装
XixiziMeng的博客
09-27 1986
vue
解决vue-cli@3安装问题与ts-vue项目搭建教程
"本文主要讲述了如何解决在安装vue-cli@3.xx时遇到的问题以及如何使用该版本的vue-cli搭建一个TypeScript驱动的Vue项目。在解决问题的过程中，提到了检查和更新Node.js版本、使用nvm(node版本管理器)以及通过vueui...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值