使用脚手架搭建vue项目

1.安装nodejs
百度搜索nodejs的英文官网,选择合适版本、合适操作系统的安装包下载
下载完成后next–>next安装成功

2.验证是否安装成功
打开命令行(mac 终端)
在命名行(终端)输入 node -v 命令
如果显示node版本则表示安装成

3.安装淘宝镜像
在命令行(windows系统)输入:
npm install -g cnpm –registry=https://registry.npm.taobao.org

在终端(mac系统)输入:
sudo npm install -g cnpm –registry=https://registry.npm.taobao.org

回车后,如果安装完成则
在命令行(终端)中输入 cnpm -v 查看是否有版本提示,如果有则表示镜像安装成功

安装成功后,以后的npm install 用 cnpm install 代替,速度比npm install快

4.安装vue脚手架 vue-cli
在命令行(windows系统)输入:
cnpm install -g vue-cli
在终端(mac系统)输入:
sudo cnpm install -g vue-cli
(-g表示全局安装)

回车后,如果安装完成则
在命令行(终端)中输入 vue 查看vue命令是否有效,如果有效则表示安装成功

5.拉取项目模板
在你的磁盘上新建一个文件夹,任意命名
通过ls命令(列出当前文件夹下的所有目录)、cd(进入到指定的文件夹下)、cd ../(回到上一级目录结构)
进入到刚刚新建的文件夹下
在该文件夹下的终端输入 vue init webpack my-project
(webpack表示模版名称,还有其他的模版,my-project是任意命名的项目名称)
回车后就进行项目结构的拉取

6.进入到上面的项目目录结构(具有package.json文件的文件夹下),打开终端
在终端中输入sudo cnpm install

(扩展:以后要频繁在某个指定的文件夹下打开终端,所以需要配置mac系统
打开系统偏好设置—>键盘—->快捷键—–>选中服务(左侧)—->勾选中右边”新建于文件夹位置的终端”

然后在finder中找到你自己的文件夹,选中该文件夹右击,弹出的右击菜单列表中最后一项是服务—>新建于文件位置的终端,
点击该选项就可以快速在该文件夹位置打开终端
)

7.运行项目,在项目所在的文件夹下打开终端
在终端输入npm run dev 运行项目

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值