webpack

webpack是什么？

    资源管理工具与打包工具，主要适用于单页面复应用（spa）,spa通常有一个页面加上一些按需加载的js文件组成

.vue单文件组件是什么？

1.     如何产生：在使用webpack构建vue时所使用的一种新的模式，.vue单文件组件就是一个后缀为vue的组件，在webpack中可使用vue-loader进行处理。vue-loader分别对<template><script><style>处理

2.      文件结构：.vue组件一般包括三部分：

                           <template>html模版</template>

                           <script>事件</script>

                           <style>样式</style>

   3.       使用前提：安装vue-loader,vue-style-loader

                               babel与babel-loader es6需要

   4.     webpack打包后空白

           记得改一下config下面的index.js中bulid模块导出的路径。因为index.html里边的内容都是通过script标签引入 的，而你的路径不对，打开肯定是空白的。先看一下默认的路径。

module.exports = {
  build: {
    env: require('./prod.env'),
    index: path.resolve(__dirname, '../dist/index.html'),
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    productionSourceMap: true,

          assetsPublicPath默认的是  ‘/’  也就是根目录。而我们的index.html和static在同一级目录下面。  所以要改为  ‘./ ’