vue-loader的实现原理是什么

　　一. vue-loader的作用是什么

　　1.首先我们需要达成共识的是，目前浏览器，只能识别普通的html、css、javascript。

　　2.但是为了能够方便使用vue的组件化开发，需要我们将代码写在.vue单文件组件中。

　　3..vue文件，以及其内部的template、style、script区域代码，不能直接交给浏览器去解析，因为它解析不了。

　　4.所以我们需要一个vue-loader进行.vue单文件组件代码的转换，也就是

　　5..vue方便开发 ------> vue-laoder协助翻译 -----> 浏览器才能展示

　　二. vue-loader 工作原理

　　vue-loader 的工作流程， 简单来说，分为以下几个步骤:

　　1.将一个 .vue 文件 切割成 template、script、styles 三个部分。

　　2.template 部分 通过 compile 生成 render、 staticRenderFns。

　　3.获取 script 部分 返回的配置项对象 scriptExports。

　　4.styles 部分，会通过 css-loader、vue-style-loader， 添加到 head 中， 或者通过 css-loader、MiniCssExtractPlugin 提取到一个 公共的css文件 中。

　　5.使用 vue-loader 提供的 normalizeComponent 方法， 合并 scriptExports、render、staticRenderFns， 返回 构建vue组件需要的配置项对象 - options， 即 {data, props, methods, render, staticRenderFns...}。