极客观点
项目管理
HarmonyOS
我用Vue-cli创建了一个最简单的项目，在main.js里面给Vue实例添加了data属性，为什么不能显示在页面上．同样的问题也会出现在用webpack + vue-loader的场景．现在所有数据都只能添加到Component里面．
main.js
import Vue from 'vue'
//import App from './App.vue'
Vue.config.productionTip = false
new Vue({
el: "#app",
data() {
return {
msg: "Hello from Vue!"
}
},
//render: h => h(App)
}).$mount('#app');
index.html
<!DOCTYPE html>
<html>
<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="shortcut icon" href="<%= webpackConfig.output.publicPath %>favicon.ico">
<title>vue-cli-example</title>
</head>
<body>
<noscript>
<strong>We're sorry but vue-cli-example doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app">
{{msg}}
</div>
<!-- built files will be auto injected -->
</body>
</html>
因为 这个 html 只是给你是给你挂载用的
vue脚手架 不会 去编译 这个 html
他们只会去编译 .vue 单文件 组件 文件
你只能把数据 属性什么的 写在 .vue 中
可以学习一下 这个开源项目 基于 vue2 + vuex 构建一个具有 45 个页面的大型单页面应用