Vue脚手架初始化&脚手架结构分析

一、初始化脚手架

第一步 (仅第一次执行)全局安装@vue/cli
安装@vue/cli之后,电脑中多了一个vue命令,以后通过vue命令进行创建脚手架
安装@vue/cli的命令:npm install -g @vue/cli

第二步:切换到你要创建项目的目录,然后使用命令创建项目。xxxx是自定义项目名称。
vue create xxxx

第三步:启动项目
npm run serve

速度慢的话:需要 npm 设置淘宝镜像


创建项目
在这里插入图片描述

选择vue版本

在这里插入图片描述

在这里插入图片描述

然后进入目录
执行命令
在这里插入图片描述

cd vue_test
npm run serve

翻译过后,开启一个内置的8080端口的服务器。
在这里插入图片描述

HelloWorld的演示
在这里插入图片描述


二、分析脚手架结构

  • .gitignore
    git的忽略文件,哪些文件或者文件夹不想接受git的管理
  • babel.config.js
    这个文件很重要,但是并不需要我们在这里面写东西。这个文件是babel(负责ES6转ES5的)的控制文件。
  • package-lock.json
    包版本控制文件
  • src/assets
    放静态资源(很多人都要使用)
  • public
    项目的根访问目录,index.html在public里面
  • src文件夹下
    • App.vue
      类似于index.html,根组件
    • main.js
      脚手架核心js
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值