vue.js有著名的全家桶系列,包含了vue-router,vuex, vue-resource,再加上构建工具vue-cli,就是一个完整的vue项目的核心构成。
在这里,我们进行一次vue-cli的安装:
首先打开你的cmd,别告诉我你不会?你不会我告诉你啊!(win+r,输入cmd)。也可已选择你想安装vue-cli的文件夹。
在这里我选择在我桌面的LyuSen文件夹进行
可使用shift+右键
接下来正式开始了。
1、检查你自身的node版本号(或是否安装):使用 node -v
如过你没安装,请出门:http://nodejs.cn/download/
或版本不够:请…
1>.更新node.js版本命令:
npm install -g n
2>.升级node.js到最新稳定版
n stable
在这申明一下:vue-cli目前已经是3.x版本,这里安装3.x。
推荐环境:
node.js 8.10以上 (能用node -v 检测版本)
npm最新版本 (能用npm -v 检测版本)
顺便检查是否有vue及其版本号:vue -V (V大写)
如过你的vue没安装,或者版本过低,请…
1>、卸载旧版本(1.x或2.x)
npm uninstall vue-cli -g
2>、安装3.X版本
npm install -g @vue/cli (可用vue --vursion 或 vue -V 来检测版本)
为了演示一遍,我重新装回了2.x:
卸载:(等待是最漫长的…)
卸载完了,使用vue -V:
安装:(再一次等待…)
安装完成:
使用vue -V:
vue init webpack test (名字自定义,在这用test)
template下载完毕后,进入创建vue-cli
(1)project name 项目名,直接回车采用文件夹名,可自定义(不能有大写)
(2)Project description,项目描述,直接回车采用()内容,可自定义。
(3) Author,作者名,直接回车采用(),内容可自定义。
(4)vue build,面向对象,采用第一个,面向大多数用户。
(5)Install vue-router,是否安装vue路由,根据自身要求,默认Yes,在这我选yes。
(6) ESLint,eslint语法检查,可能会恶心到人,暂不推荐yes,不过想规范自己的,可以选择yes。在这我选择yes.之后如图,选一,回 车
(7)Set up unit tests,根据自身要求,可以选no,在这我选no。
(8)Setup e2e tests with Nightwatch。根据自身要求,可以选no,在这我选no。
(9)Should we run npm install
for you after the project has been created? (recommended),选一,使用Npm,如图
然后继续等待吧…
安装完成后,会提示你根据黄字操作即可使用:
注意一下,有的人下载文件内容时候,会少下载一些东西,导致安装虽然结束却仍然报错,或者执行npm run dev 的时候报错。打开自己建的文件夹(案例种是test文件夹)
先看一眼你是否有 node_modules:
如果没有的,别慌,先根据黄字要求,进入自己的文件夹先:
然后使用 npm install 重新下载!
为了实例化,以下我将要先删除node_modules,然后重新安装:
删除后运行:npm run dev会是这样的:
所以使用npm install 重新下载:继续漫长的等待吧。
安装完后,再次运行npm run dev!!还是要等待!!(箭头指出的是我们输入的命令行啊!)
苦心人天不负!!!
http://localhost:8080,根据提供的这个链接,少年啊,快去创造奇迹!