node.js+vue的安装及使用超详细

node.js+vue的安装及使用

一、配置Nodejs环境:

1.1安装node.js

  1. 前往下载Nodejs windows版:http://nodejs.cn/download/
  2. 闭眼安装,注意路径不要有中文
  3. 安装完成后,打开cmd,测试是否安装成功:
  4. 输入:node -v,查看node的版本
  5. 输入:npm -v,查看npm的版本
    node.js+vue的安装及使用超详细 这样就安装完成了node.js

1.2、安装淘宝的cnpm镜像,替代默认的npm:

npm install -g cnpm --registry=https://registry.npm.taobao.org

1.3、安装Vue脚手架:

cnpm install vue-cli -g

需要注意的是: Linux/Mac执行-g全局安装,需要在命令前添加sudo,表示已管理员身份运行。

1.4、安装webpack-cli:

cnpm install webpack-cli -g

二、使用vue-cli初始化一个项目

vue init webpack 项目名
项目名可以不加,不写的话,就是在当前位置创建项目。

node.js+vue的安装及使用超详细
输入完以后 直接回车就可以了 node.js+vue的安装及使用超详细

这里需要注意的是 只有第一个yes其余no就ok了 如果不no在打代码的时候会有不必要的麻烦

node.js+vue的安装及使用超详细
到此我们的项目就创建完毕了

三、启动项目

3.1 启动运行命令:

cnpm run dev
这里需要注意的是 我们启动项目必须在你创建的那个项目里启动

node.js+vue的安装及使用超详细

运行命令以后会出现这样一句代码 把后面那段代码复制到你的浏览器就ok了

node.js+vue的安装及使用超详细

这就是我们安装及使用的基础教程,小伙伴们快去练习把!