vue-cli 笔记2

接触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文件里.

学到这里就变成了,
怎么分割组件的问题.