好家伙,
(粗略的大概的解释)
<!DOCTYPE html> <html lang=""> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <link rel="icon" href="<%= BASE_URL %>favicon.ico"> <title><%= htmlWebpackPlugin.options.title %></title> </head> <body> <noscript> <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong> </noscript> <div id="app"></div> <!-- built files will be auto injected --> //我们要将App.vue中的内容渲染到这里 </body> </html>
//导入vue这个包,得到Vue构造函数 import Vue from 'vue' //导入App.vue根组件,将来把App.vue中的模板结构,渲染到Html页面中 import App from './App.vue' Vue.config.productionTip = false //创建Vue的实例对象 new Vue({ el:'App', //把render函数指定的组件,渲染到Html页面中 render: h => h(App), //用render函数指定的结构替换掉el所在的结构 }).$mount('#app')
<template> <h1>你好帅</h1> </template>