Vue loader的基本使用

vue-loader的概念

其他loader：css-loader、url-loader、html-loader等
先来了解一下模块的概念，比如在nodeJS中，有require和exports关键字。

很早有个broserify，是个js模块加载器。
现在流行的是webpack，因为它不光你能加载js文件，还可以是css文件或图片等资源。
webpack，我们可以认为也是更加高级的模块假期，围绕它一切东西都是模块。

这些loader是干嘛的？
我们知道在html中，我们引入css文件是link标签，
但比如我们需要

require('style.css')

在Vue开发中，有.vue文件，vue-loader就是用来加载这类文件的，然后在通过webpack打包编译成我们浏览器认识的代码。vue-loader是基于webpack的。

.vue文件

.vue文件就是放置vue的组件代码，结构如下：

<template>
 //html
</template>

<style>
//css
</style>

<script>
//js
</script>

项目目录结构
webpack是模块分开写，最后打包在一起。
简单的目录结构如下：

|-index.html
|-main.js 入口文件
|-App.vue vue文件
|-package.json 工程文件(项目依赖、名称、配置)，npm init –