vue--vueCLI

何为CLI

■ CLI是Command-Line Interface,俗称脚手架.

■ 使用Vue.js开发大型应用时,我们需要考虑代码目录结构、项目结构和部署、热加载、代码单元测试等事情。(vue 脚手架的作用),

而通过vue-cli即可:vue-cli 可以快速搭建Vue开发环境以及对应的webpack配置。

■ Vue.js官方脚手架工具就使用了webpack模板。

安装

复制代码
npm install -g @vue/cli

创建(在当前目录下)

复制代码
npm create 项目名

运行

复制代码
npm run serve

脚手架结构

render函数

复制代码
render: h => h(App),

这样配置时:

复制代码
new Vue({
    el:"#app",
    template:'<div><App></App></div>',
    comments:{App}
  // render: h => h(App),
})
// .$mount('#app')

会解析错误:

要么使用完成版的vue.js:其包含核心功能+模板解析器

要么使用运行版的vue.runtime.xxx.js:其只有核心功能,因为没有模板解析器所以无法使用template配置项,需要render函数接收createElement函数指定具体内容

组件中使用template 则由下面去解析

复制代码
import { Vue } from './vue'  // 就是运行版的vue

解构说明

相关推荐
代码搬运媛8 小时前
Jest 测试框架详解与实现指南
前端
counterxing9 小时前
我把 Codex 里的 Skills 做成了一个 MCP,还支持分享
前端·agent·ai编程
wangqiaowq9 小时前
windows下nginx的安装
linux·服务器·前端
之歆9 小时前
DAY_12JavaScript DOM 完全指南(二):实战与性能篇
开发语言·前端·javascript·ecmascript
发现一只大呆瓜9 小时前
Vite凭什么这么快?3分钟带你彻底搞懂 Vite 热更新的幕后黑手
前端·面试·vite
Maimai108089 小时前
React如何用 @microsoft/fetch-event-source 落地 SSE:比原生 EventSource 更灵活的实时推送方案
前端·javascript·react.js·microsoft·前端框架·reactjs·webassembly
candyTong9 小时前
Claude Code 的 Edit 工具是怎么工作的
javascript·后端·架构
kyriewen11 小时前
产品经理把PRD写成“天书”,我用AI半小时重写了一遍,他当场愣住
前端·ai编程·cursor
humcomm12 小时前
元框架的工作原理详解
前端·前端框架
canonical_entropy12 小时前
Attractor Before Harness: AI 大规模开发的方法论
前端·aigc·ai编程