一、安装node.js
- node.js官网:https://nodejs.org/zh-cn/
- 从node.js官网下载并安装node,安装过程很简单,一直点下一步就ok了,安装完之后,我们通过打开命令行工具(win+R)输入cmd。然后输入node -v 命令,查看node的版本,若出现相应的版本号,则说明你安装成功了。安装完node.js之后,npm也会自动安装
- 查询是否安装成功的命令:node -v 与 npm -v
二、安装vue
-
vue-cli官网:https://cli.vuejs.org/
-
全局安装脚手架工具vue-cli,命令如下:npm install --global vue-cli
-
安装完成之后输入
vue -V
出现相应的版本号检查是否安装成功
-
vue项目初始化命令如下,若没有安装webpack,则先安装webpack安装命令:npm install -g webpack
-
创建项目命令:vue init webpack myVue(这里的myVue自定义项目名称)
注:安装过程 中有个选项(Use ESLint to line your code ?选择 No )
- ? Project name myVue(项目名称myVue)
- ? Project description A Vue.js project(项目描述一个Vue.js项目)
- ? Author(作者)
- ? Vue build standalone(Vue构建独立的)
- ? Install vue-router? Yes(安装vue-router )
- ? Use ESLint to lint your code? No(使用ESLint来lint您的代码)
- ? Set up unit tests Yes(设置单元测试号)
- ? Setup e2e tests with Nightwatch? Yes(用夜视器设置e2e测试)
- ? Should we run
npm install
for you after the project has been created? (recommended) npm(我们应该在项目创建后为您运行’ npm安装’吗(推荐)npm)
- 配置完成后,项目目录下出现项目文件,进入项目文件夹
三、安装完成后初始化项目:
- 输入命令:cd myVue进入项目目录。
- 输入命令:npm install 安装package.json包中的依赖。
- 输入命令:npm run dev运行项目。
- 在浏览器上输入:localhost:8080,将会出现下面的vue初始页面项目运行成功: