63.vue2.0学习 —— Vue脚手架

本文介绍了如何使用Vue官方脚手架进行项目初始化,包括全局安装、创建新项目、启动服务,以及模板项目的组成部分和配置文件。后续将探讨Vue自定义事件的使用。
摘要由CSDN通过智能技术生成

上一篇:Vue组件化编程

初始化脚手架

说明

  1. Vue脚手架是Vue官方提供的标准化开发工具(开发平台)。
  2. 最新的版本是4.x。
  3. 文档: https://cli.vuejs.org/zh/。

具体步骤

第一步(仅第一次执行):全局安装@vue/cli。

npm install -g @vue/cli

第二步:切换到你要创建项目的目录,然后使用命令创建项目

vue create xxxx

第三步:启动项目

npm run serve

备注:

  1. 如出现下载缓慢请配置npm淘宝镜像:npm config set registry https://registry.npm.taobao.org
  2. Vue脚手架隐藏了所有webpack相关的配置,若想查看具体的webpakc配置,请执行:vue inspect > output.js

模板项目的结构

├── node_modules
├── public
│ ├── favicon.ico: 页签图标
│ └── index.html: 主页面
├── src
│ ├── assets: 存放静态资源
│ │ └── logo.png
│ │── component: 存放组件
│ │ └── HelloWorld.vue
│ │── App.vue: 汇总所有组件
│ │── main.js: 入口文件
├── .gitignore: git版本管制忽略的配置
├── babel.config.js: babel的配置文件
├── package.json: 应用包配置文件
├── README.md: 应用描述文件
├── package-lock.json:包版本控制文件

下一篇:vue自定义事件

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值