vue为了为我们提供不同环境的支持,So,vue有很多不同的版本,
![](https://box.kancloud.cn/a160f1268132112b5cdc6357bab17bed_195x230.png)
当`import vue from 'vue'`的时候,
vue默认会采用vue.runtime.xx.js
开发环境为.esm.js
正式环境为.min.js
而runtime的版本是不能在vue实例中定义template属性的,这会导致报错
```
import Vue from 'vue';
import App from './App';
import router from './router';
new Vue({
el: '#app'
, router
, components: {App}
, template: '<App/>'
});
```
![](https://box.kancloud.cn/2ede8669d13fd0701f063a2a2a64ce81_693x66.png)
通过当前版本的vue-cli创建的项目,不支持在`new Vue`时使用`template`属性设置模板,因为runtime-only无法编译模板
请使用render方法进行根组件的渲染
```
new Vue({
router,
render: h => h(App)
}).$mount('#app')
```
- 空白目录
- vue-cli
- runtime-only
- Vue对比React
- 组件与实例
- data-binding
- computed的set和get
- scoped
- 事件
- 自定义指令
- 插件
- keep-alive
- $nextTick与生命周期
- 路由
- Vue.use(Router)
- this.$router编程式导航
- this.$route
- new Router
- routes
- mode
- linkClass
- scrollBehavior
- query
- fallback
- base
- router-view
- router-link
- 路由守卫
- 左右切换
- 滚动
- FAQ
- vuex
- 适用
- new Vuex.Store
- state
- mutations
- getters
- actions
- strict
- plugins
- modules
- namespace
- this.$store
- commit
- dispatch
- mapXX
- eventBus
- Vue工程相关
- 引用路径的简化
- css-module
- vue-loader
- 异步加载
- 支持jsx
- 让webpack支持对vuex的热替换
- .eslintrc