Vue脚手架安装

Vue脚手架安装

一、安装npm

  1. 安装node.js
  2. 打开cmd (Windows+R)
  3. 输入 npm -v 查看npm版本
  4. 输入 npm install npm -g 升级npm版本

国内直接使用 npm 的官方镜像非常慢,这里推荐使用淘宝 NPM 镜像。
淘宝 NPM 镜像是一个完整 npmjs.org 镜像,你可以用此代替官方版本(只读),同步频率目前为 10分钟 一次以保证尽量与官方服务同步。
你可以使用淘宝定制的 cnpm (gzip 压缩支持) 命令行工具代替默认的 npm:

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

二、安装vue/cli

vue/cli:vue官网提供脚手架工具,默认的搭建好一个项目的基本的架子,我们在基础上进行相应的开发和修改。

  1. 安装vue/cli:打开(windows + R) cmd
  2. 输入 npm install -g @vue/cli
  3. 查看是否安装成功及版本: vue -V
  4. 卸载 vue/cli 输入 npm uninstall -g @vue/cli

三、初始化vue项目

  1. 在电脑中新建一个文件夹(文件夹的路径不能包含中文及特殊字符) window + R cmd 切换到文件夹的路径下,输入 vue create dome(dome 项目的名称)
  2. 点击确定, 键盘上下键,可以选择默认的default ,还是手动的(manually),选择默认的default ,回车,就ok了

注意:
空格键 选中 取消
A 全选 和 取消
是否保留配置 N no Y yes

四、运行vue

  1. cd 进入到项目的目录, 输入npm run serve,回车,等几秒,就会出现如下这个界面,就代表成功了。
    Vue脚手架安装_第1张图片
  2. 在浏览器上输入 http://localhost:8080/ ,就可以看见vue项目了。
    Vue脚手架安装_第2张图片

五、注意 !!!!

如果在安装vue/cli的过程中遇到错误,可以windows+R,输入C:\Users\dell\AppData,打开AppDate这个隐藏文件夹,进入Roaming这个文件夹里之后把关于npm的文件夹都删掉(npm ,npm-cache 我的电脑里面就这两个,具体要看自己的电脑里,反正就是关于npm的都删掉);之后windows + R
运行,输入cmd。

安装npm:

  1. 运行 npm config set registry “https://registry.npm.taobao.org” 回车
  2. 之后输入 npm config set sass_binary_site “https://npm.taobao.org/mirrors/node-sass”
  3. 运行 npm i;
  4. npm -v 查看npm的版本

之后就可以按照步骤去按照vue/cli和运行vue项目了。

你可能感兴趣的:(vue,npm,vue.js)