怎么安装vue?
发布网友
发布时间：2024-09-29 15:10
共1个回答
热心网友
时间：2天前
首先安装nodejs
终端输入：brewinstallnodejs?或者直接官网手动安装。node-v查看nodejs版本
注：网上说使用终端安装会需要nodejs模块安装目录的权限，运行：sudochmod-R777/usr/local/lib/node_modules/
3、安装npm（淘宝镜像）
终端输入：npminstall-gcnpm--registry=
4、安装webpack
cnpminstallwebpack-g
5、安装vue脚手架（自动搭建vue项目框架的工具）
sudonpminstall-gvue-cli。静待。
输入vue或者vuelist，可vue是否安装成功。
vue离线安装依赖包
离线安装vue环境的方法:1、cmd运行命令“npmconfiggetcache”;2、内网电脑安
装nodejs;3、内网全局安装目录:4、内网命令安装离线依赖包;5、把vue项目复制到内网:6、查看全局命令是否正常即可。
Vue.js安装在看教程时里面提到
什么是NPM？
NPM手册-W3Cschool
所以NPM类似conda，不过conda是Python的，属于anaconda；NPM是JavaScript的，属于Node.js。
那什么是Node.js？
Node.js教程-W3Cschool
Node.js安装配置
安装完看环境变量有没配置，没有的话配置一下：
node.js安装后输入“node-v”提示'node'不是内部或外部命令，也不是可运行的程序的解决方法
安装完node.js，配置好环境后可以开始vue.js安装了！
参考安装vue.js的方法可以再安装上cnpm和vue-cli脚手架构建工具。
cnpm和vue-cli都是直接打开cmd用npminstall方式安装，不需选择路径。
安装cnpm:
安装vue-cli:
所以继续按照官方教程，安装vue
但是，还是不清楚vue该装在哪。。。
先在node.js的路径下安装试试：
应该没有错吧？
迫不及待要开始了~~~
vue-cli脚手架安装及运行Vue是：构建用户界面的渐进式框架，可以自底向上逐层应用（大概是这个意思？由基层开始做起，把基础的东西写好，再逐层往上添加效果和功能。）
（前期刚学时不建议直接安装vue-cli脚手架，可以直接通过script/script引入，如：scriptsrc=""/script然后直接用就行了）
1.首先Windows+R打开cmd；输入npm-v和node-v检测是否安装了npm和node.js，没安装先去安装node.js（npm是随node.js一起安装的包管理工具，就不用安装了）附上node.js安装地址：
2.然后还需要淘宝镜像安装cnpm和webpack支撑（有时候安装依赖特别慢就会用到cnpm）
淘宝镜像安装cnpm命令：
安装之后执行cnpm-v，如果出现相应的版本号就是安装成功
webpack安装命令：
安装之后执行webpack-v，它会问你：
直接回车就可以，然后再执行webpack-v，如果出现相应的版本号就是安装成功
3.最后就是安装vue-cli脚手架了
vue-cli脚手架安装命令：
安装之后执行vue-V?，如果出现相应的版本号就是安装成功
4.用vue-cli创建一个基于webpack的新项目并运行
首先可以在桌面新建一个文件夹，如：Vue
然后执行cdVue进入文件夹，然后输入以下命令新建项目，回车
然后根据提示一路回车，这时文件夹下就会有很多相关文件了
最后用cnpm安装依赖：
最后的最后就是运行项目啦输入以下命令：
或者以下命令也可以：
如果成功的话，一般就是提醒你可以在浏览器地址栏输入以下地址就能正常访问了
至此，应该就可以正常访问一个新建的项目了，接下来的就是在新项目中通过组件、事件、指令等等丰富项目。
本文根据vue.js官方文档学习总结。附上官方文档：
【vue入门】vue安装方式安装vue的方式有很多种：
????vue官网地址：???
??后续通过webpack和cli的使用，可以使用这种方式
Vue3.x超详细安装教程metacharset="utf-8"
npm或yarn安装
查看版本（是否安装成功）：
进入demo目录：cdG:\demo\
创建my-project项目：vuecreatemy-project
选择自己所要集成的配置（格键是选中与取消，A键是全选，回车确定）
这里我的选择如下：
配置项：
这里我选择：3.x
安装的vue-cli将会是基于vue3.x版本
如果在项目中想要保持使用TypeScript的class风格的话，建议大家选择y。
这里我选择：y
这里我选择：y
这里我选择：y
Sass/SCSS分两种：
这里我选择：Sass/SCSS（withnode-sass）
这里我选择：ESLintwitherrorpreventiononly
这里我选择：Lintonsave
这里我选择：Indedicatedconfigfiles
这里我选择：N
cdmy-project(进入项目根目录)
yarnserve(启动项目)
现在的目录是Vue3.x的cli看上去简洁多了，去掉了Vue2.x中build和config等目录
在项目的根目录下新建vue.config.js文件（是根目录，不是src目录）
