井井客

搜索

【VUE实例】win7从零安装vue-cli脚手架

win7系统中第一次使用安装vue-cli脚手架,使用nodejs自带的Node.js command prompt,主要的内容还是参照https://github.com/vuejs/vue-cli官方说明。

【VUE实例】win7从零安装vue-cli脚手架

当你安装最新的nodejs(我是安装在C:\Program File\nodejs)时,尽量别安装在(x86)这个文件夹,不然“可能”会有未知的错误,而且名字短的话你也方便查找到文件。好了~完成安装之后下面的步骤对你来说应该都是比较简单的。

【1】打开Node.js command prompt命令行工具输入:

npm install -g vue-cli

虽然刚打开命令行默认是在管理员目录,但是只要带上“-g”,那么在"C:\Program Files\nodejs\node_modules"这个目录下面,都会多一个"vue-cli"文件夹。就是我们说的全局安装了。

【2】去项目待建位置

我自己习惯是将网站相关的东西放到E盘,这次我的项目也安排在了E盘下的demo文件夹中,所以我要跳到这个位置先~

e:
cd demo

注意:CMD里面的命令跟bash会有点区别,需要先跳到E盘,再打开demo文夹件

【3】初始化vue项目信息

vue init <template-name> <project-name>

其中“template-name”就是官方提示的Vue项目模板,目前有:“webpack”、“webpack-simple”、“browserify”、“browserify-simple”、“simple”。而“project-name”表示你的项目命称

例如:

vue init webpack my-project

输入完成之后会提示输入一些项目信息,根据自己的的项目需求添加(我自己在填到Y/N的时候都是用N的。)

【4】打开项目目录

在上一步执行完成之后,会在demo中多一个"my-project"文件夹,现在打开这个文件夹

cd my-project

【4】安装项目依赖

npm install

执行一这步,就相当于是将“package.json”文件中提到的依赖安装到当前“node_modules”目录中。

【5】开始运行项目

npm run dev

完成这一步就好了,到时候会弹出“http://localhost:8080/”的http网址了。

这么说应该是比较详细了吧,下图又把整了一下具体的操作

PS:win10系统,如果nodejs安装在C盘时,进行安装vue-cli报错的话,可以重新将nodejs安装到D盘。

文章TAG:VUE

作者:井井客整理来源:原创
本文标题:【VUE实例】win7从零安装vue-cli脚手架
本文链接:http://www.jingjingke.com/c/02245.html

上一篇:兼容移动端仿swiper左右滚动图片
下一篇:【VUE实例】vue-router2安装及小例子

文章分类

相关阅读

随便看看