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

解构说明

相关推荐
四棱子6 分钟前
炫酷!18.5kb实现流体动画,这个开源项目让个人主页瞬间高大上!
前端·开源
Sparkxuan7 分钟前
封装WebSocket
前端·websocket
工呈士7 分钟前
Redux 实践与中间件应用
前端·react.js·面试
Nano7 分钟前
深入解析 JavaScript 数据类型:从基础到高级应用
前端
无羡仙8 分钟前
浮动与BFC容器
前端
xphjj8 分钟前
树形数据模糊搜索
前端·javascript·算法
刺客_Andy8 分钟前
React 第三十四节 Router 开发中 useLocation Hook 的用法以及案例详解
前端·react.js
我的div丢了肿么办8 分钟前
HarmonyOS鸿蒙tabBar的详细讲解
前端·javascript·harmonyos
皓子9 分钟前
海狸IM桌面端:AI辅助开发的技术架构实践
前端·electron·ai编程
Nano10 分钟前
优雅处理 JavaScript 异步问题的终极指南
前端