美文网首页
nodejs->npm->cnpm->vue-cli的安装(20

nodejs->npm->cnpm->vue-cli的安装(20

作者: Allenem | 来源:发表于2018-11-18 00:36 被阅读0次

参考 vue-cli 脚手架 安装Windows10环境下安装Nodejs、cnpm

一、nodejs的安装

两个步骤:

1.直接去官网(即https://nodejs.org/en/)下载安装包直接双击安装

官网图 install1 install2 install3 install4 install5 选择适合自己的 install6 install7 install8

安装成功后可以如下查看

$ node -v
node版本

2.进入nodeJS的安装目录

npm install express -g  (-g 表示全局安装)
npm install jade
npm install mysql

二、npm的安装

由于Nodejs自带了npm,所以你安装nodejs后,npm也会自行安装。
接下来可以在命令行输入下面命令来检测安装成功和版本号:
node -v 和npm -v。若出现不是内部命令看下一步。


npm版本

一般安装完后,windows系统会将安装目录自带到系统变量Path路径后面,否则的话,就在windows设置环境变量的地方,将Nodejs安装路径添加到Path路径后面。(笔者此处是在Path后面新建E:\Program Files\nodejs)确认后,重启CMD,进行检测node和npm。

点击右栏高级系统设置,环境变量 编辑环境变量

三、cnpm的安装

由于npm的镜像是国外的,为了加快下载速度,可以通过国内淘宝镜像来下载,所以采用cnpm,当然也可以不采用cnpm,直接把镜像指向淘宝镜像,接下来我说下这两种方式:

方法1. 直接指定registry为淘宝镜像

npm config set registry https://registry.npm.taobao.org

然后若需要安装gulp和less,可以直接用

npm install gulp less --save-dev

就是从taobao镜像拿包了

方法2. 安装cnpm

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

输入上述命令即可安装,另外要注意的是,安装完后,输入cnpm -v进行检测。由于笔者操作了第四步,cnpm跟npm是分开的,即npm里没有cnpm,之前设置的node环境变量对cnpm不起效,会出现输入cnpm不是内部命令这个问题,此时各位需要注意的是,一般这类问题都是跟环境变量有关,此时需要在环境变量Path路径后面加上E:\Program Files\nodejs\node_global,即cnpm脚本命令所在的文件夹目录下。

四、vue-cli的安装

1.安装完成node。node有自带的npm,可以直接在cmd中,找到nodeJs安装的路径下,进行命令行全局安装vue-cli。

npm install -g vue-cli    // 加-g是安装到全局

想安装速度快点,可以使用淘宝镜像如下

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

2.安装后,检查是否安装成功(显示版本则安装成功)查看vue版本(注意-V是大写

vue -V  //注意-V是大写
vue版本

3.使用vue建一个项目,名叫“firstvueproject”

vue init webpack firstvueproject
newproject1 newprojuct续1 newproject2 实践成功

相关文章

  • nodejs->npm->cnpm->vue-cli的安装(20

    参考 vue-cli 脚手架 安装和Windows10环境下安装Nodejs、cnpm 一、nodejs的安装 两...

  • web前端初始化配置全流程

    MAC版本 一、###安装node-下载后一路回车 二、###安装cnpm-淘宝镜像 安装git管理工具-Mac ...

  • vue 学习第一节

    全局安装vue-cli: cnpm install vue-cli -g 安装vue-cli之前要全局安装vue和...

  • Vue 第一天

    使用vue-cli,快速创建项目 安装Vue-cli vue-cli 在国外,安装慢,需通过国内镜像安装 安装国内...

  • Vue-cli 安装和目录结构解析

    一、安装vue-cli 安装vue-cli前提,你的电脑已经安装好了Node.js,因为vue-cli 安装是给予...

  • nodejs-安装

    安装,node所有版本列表找到相应版本),我是windows 64版本,所以选择64.msi. 傻瓜式安装就好,就...

  • Vue-cli基础

    Vue-cli基础 安装步骤 1、全局安装Vue-cli: npm install vue-cli -g 2、查看...

  • (Vue全家桶)Vue-cli

    Vue-cli Vue-cli是vue官方出品的快速构建单页应用的脚手架 安装vue-cli 安装vue-cli的...

  • Vue.js高仿饿了么笔记(一)

    Vue-cli 安装 安装node 通过npm安装Vue-clinmp install -g vue-cli /...

  • vue-cli的安装

    vue-cli的安装 cnpm install -g vue-cli 检查是否安装成功 vue 安装webpack...

网友评论

      本文标题:nodejs->npm->cnpm->vue-cli的安装(20

      本文链接:https://www.haomeiwen.com/subject/wuhwfqtx.html