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

解构说明

相关推荐
顾安r17 小时前
11.8 脚本网页 推箱子
linux·前端·javascript·flask
Jonathan Star17 小时前
Vue JSON结构编辑器组件设计与实现解析
vue.js·编辑器·json
Amewin18 小时前
在vue3+uniapp+vite中挂载全局属性方法
javascript·vue.js·uni-app
玖釉-18 小时前
用 Vue + DeepSeek 打造一个智能聊天网站(完整前后端项目开源)
前端·javascript·vue.js
zhangyao94033019 小时前
关于js导入Excel时,Excel的(年/月/日)日期是五位数字的问题。以及对Excel日期存在的错误的分析和处理。
开发语言·javascript·excel
骑驴看星星a19 小时前
【Three.js--manual script】4.光照
android·开发语言·javascript
devincob1 天前
js原生、vue导出、react导出、axios ( post请求方式)跨平台导出下载四种方式的demo
javascript·vue.js·react.js
编程社区管理员1 天前
React 发送短信验证码和验证码校验功能组件
前端·javascript·react.js
葡萄城技术团队1 天前
迎接下一代 React 框架:Next.js 16 核心能力解读
javascript·spring·react.js
全马必破三1 天前
React“组件即函数”
前端·javascript·react.js