使用 vue-cli 脚手架构建 vue 项目

 

在构建项目之前,需要电脑已安装node。

构建项目之前需要安装vue-cli,全局安装:

npm install vue-cli -g

创建一个基于webpack模板的新项目:

vue init webpack 项目名称

回车之后需要输入配置:

C:\Users\SmallBag\Desktop\study\vue_test>vue init webpack vue_test

? Project name vue_test
? Project description study project
? Author future
? Vue build standalone
? Install vue-router? No
? Use ESLint to lint your code? No
? Set up unit tests No
? Setup e2e tests with Nightwatch? No
? Should we run `npm install` for you after the project has been created? (recommended) npm

   vue-cli · Generated "vue_test".

完成后接着:

cd 项目名称
npm install
npm run dev

回车后即可运行项目。

复制地址 http://localhost:34923 在浏览器上面打开,可看到:

此时项目已经创建完成并且已经运行。

创建后的项目结构:

 

 

新版本vue-cli已改名为 @vue/cli,安装时需要

npm install @vue/cli -g

如果继续使用vue-cli进行安装,将会安装2.x最新版本,不会安装3.x以上版本,目前最新版本4.3.x

3.x新版本创建项目使用:

vue create 项目名称

如果希望继续使用:

 vue init webpack 项目名称

可以安装:

npm install @vue/cli-init

 

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值