windows下Vue环境搭建

写给自己看看

1.根据自己的机型下载安装node,http://nodejs.cn/download/  安装一直默认选项即可。

    检验自己的安装是否成功:

        打开电脑的cmd,输入命令 :node -v回车

            若成功安装,会出现node的版本号

                 windows下Vue环境搭建

2.装镜像cnpm,在cmd中输入:npm install -g cnpm –registry=https://registry.npm.taobao.org 回车

windows下Vue环境搭建


不知道这水印要怎么弄掉,但没遮住任何文字。

windows下Vue环境搭建

这段我去网上查了,说是要降低版本才能解除这个警告,可是我看cmd后面跳出来的文字表达的意思是安装成功,所以我没理这个警告,继续下去。

3安装vue-cli的脚手架,仍在cmd中输入:  cnpm install -g vue-cli 回车,等待安装

windows下Vue环境搭建            

别着急,会出现一堆东西,直到跳出指令让你再次输入

        验证:在cmd中输入:vue 

            若成功会跳出版本信息          windows下Vue环境搭建

 

创建一个新的项目:

1,现在自己的电脑上面新建一个文件夹来存放你的项目,

    举例:我存在的位置D:\1demo\VUE\test(不要出现中文字符就可以)

 因为是d盘,所以我先打开d盘

windows下Vue环境搭建

接下来输入路径

windows下Vue环境搭建

开始创建项目输入

windows下Vue环境搭建

这条中的first-project是我项目的名字,你按照自己的心情填写就好,语法是前面部分

windows下Vue环境搭建

这些事接下来你会被问到的问题

ps:第四个问题是给你的一个选择,你可以通过上下箭头来选择,一般选择第一个

后面的问题都是根据需要来回答yes or no,嫌麻烦就一直enter就可以(包括第四个问题)

    vue-router 路由插件        ESLint 代码检查工具        unit test 单元测试        nightwatch 测试框架

做完这一步,你可以去看看新建的文件夹,已经出现first-project

2,在cmd中打开文件夹

windows下Vue环境搭建

3.下载依赖

windows下Vue环境搭建

4,将项目跑起来

windows下Vue环境搭建

成功之后会出现

windows下Vue环境搭建

在浏览器中打开网址

windows下Vue环境搭建

成功。