接触vue-cli之后,
感觉这才是打开vue的正确姿势.
或者说,更容易理解,vue体现了组件化.
所有vue文件都相当于是一个组件
<template>
<div id="app">
<my-component></my-component>
</div>
</template>
<script>
import MyComponent from './components/MyComponent'
export default {
name : "MyComponent",
components: {
MyComponent
}
}
</script>
<style>
</style>
import 引入的都是 对象,定义变量接收.
这里引入的是vue组件,
export default 用来导出
template 就是之前我们接触的 template,
可以放在 js里,用属性的形式定义,
也可以放在上面,用于编写 html结构.
所有的依赖关系都可以根据 import 和 export 来看清.
只有最后一环, main.js 和 index.html 是用一个插件来进行注入的.
new HtmlWebpackPlugin({//***** 我们明明没有在index.html里引入任何js文件
filename: 'index.html',//**** 就是靠这个插件把 js文件插进去的.
template: 'index.html',
inject: true// true的时候 插进去, false 的时候不插进去.
}),
就这个在webpack.dev.conf.js文件里.
学到这里就变成了,
怎么分割组件的问题.