vue入门之环境搭建(1)

935 阅读2分钟

名词解释

node:就是运行在服务端的 JavaScript。Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台。是一个事件驱动I/O服务端JavaScript环境,基于Google的V8引擎,V8引擎执行Javascript的速度非常快,性能非常好。

npm: Nodejs下的包管理器。

webpack: 它主要的用途是通过CommonJS的语法把所有浏览器端需要发布的静态资源做相应的准备,比如资源的合并和打包。 

vue-cli: 脚手架构建工具,生成Vue工程项目。相当于给你自动创建一个vue结构的项目,包含基础的依赖库,只需要 npm install就可以安装

搭建环境步骤

注意:mac下安装,执行命令时需在命令行前面上sudo,用来获取权限,提示输入mac密码,自行输入回车即可

一、安装Node.js

百度Node官网,下载并安装;

node安装结束后会自带安装npm,npm可以自行按照喜好进行升级,也可以用自带的版本。
输入node -v 查看到版本号,输入npm -v查看到npm版本号,即安装成功;

二、配置Npm淘宝镜像

用下方命令配置国内的淘宝镜像

npm config set registry registry.npm.taobao.org

用途:后期安装包的依赖时,即可使用npm XXX的方式;有些同学喜欢不喜欢这种方式喜欢cnpm也可以,这个无所谓

三、安装vue-cli

可以通过npm uninstall vue-cli -g卸载老版本的脚手架工具

windows安装:npm install -g @vue/cli

mac 下安装:sudo npm install --global vue-cli

安装成功如上图显示(我自己用的mac,windows安装自行检验)

四、安装webpack

mac 下安装:sudo npm install webpack -g

安装成功如上图显示(我自己用的mac,windows安装自行检验)

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

至此,环境搭建结束

执行 npm root -g, 可以查看node全局包的安装路径
执行 open 路径, 打开node下的全局包路径的文件夹,如下图所示

后续教程,请点击继续阅读**vue利用脚手架(vue-cli)搭建项目(2)**

悟:

前人栽树,后人乘凉;

轻松在终端上敲打几行代码,即可完成环境的搭建;

感谢前辈们通过自己的智慧,给我们提供的便利。