通过脚手架--创建vue工程

最近在做vue的项目,其实之前就有做过,一直没有好好整理一下创建项目这块,我想我应该从头梳理一下vue,希望对我自己以及用vue的小伙伴有一点帮助!

1、首先没有安装node 及 npm 的,需要安装,可参考如下链接:

node官网:https://nodejs.org/en/ 下载即可安装
其实npm已经在Node.js安装的时候顺带装好了。我们在命令提示符或者终端输入npm -v,应该看到类似的 输出:

C:\>npm -v
4.1.2
2、安装vue

我们打开命令行工具:打开npm 【npm start】
进行Vue安装 输入:
【npm install --global vue-cli】 (-global 意思是全局安装 这羊Vue会安装到 安装node 的文件夹下 否则会安装到 当前目录)
验证安装成功 输入 【Vue --version】,出现Vue版本号,则说明Vue 安装成功。

3、创建项目及依赖安装:

现在开始使用Vue创建项目:可以先进入自己想要创建项目的文件夹中,或者使用webstrom终端:
1.# 创建一个基于 webpack 模板的新项目 【vue init webpack test-lv】 test-lv(项目文件夹名)
执行这个命令后命令行会出现一些需要你填写选择的项目属性:
(项目名称)
(项目描述)
(作者)…
根据自己的情况选择就ok了!
在这里插入图片描述
should we run npm install… (这句话是在问是否在工程创建后就去跑 npm 安装依赖 这里面有几个选项 第一个是【是】 也可以选最后一个 稍后自己就安装依赖 即 在命令行执行npm install 命令 )

当看到 这样的命令说明 Vue项目创建窗成功了
在这里插入图片描述
你可以在你选择的文件加下看到这些文件 (其中node-modules是依赖安装后出现的,没安装依赖以前是没有node_modules文件夹的)

3、运行测试:

进入文件夹 执行运行命令

cd  test-lv
npm run dev

在这里插入图片描述
打开浏览器:
在这里插入图片描述

哦了!希望此文章对于想学习vue的伙伴会有的帮助哦!!!

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值