什么是webpack

简单来说webpack就是一种模块加载器兼打包工具。侧重于模块加载

webpack如何使用

webpack的使用简单来说就是：
装webpack，抄webpack文档(官网上的四个例子），装webpack插件，抄webpack插件文档到webpackconfig.js，最后npm run一下就可以用了。（具体过程太麻烦了，上面的流程就是最精简的了）

举例说明

在index.html中加入以下引用

<script src="dist/bundle.js"></script>

webpackconfig.js文件

const path = require('path');

module.exports = {
    entry: './src/index.js',
    output: {
        filename: 'bundle.js',
        path: path.resolve('dist')
    },
    module: {
        rules: [
            {
                test: /\.css$/,
                use: [
                    'style-loader', 'css-loader', 'autoprefixer-loader'
                ]
            },
            {
                test: /\.js$/,
                exclude: /node_modules/,
                use: [
                    "babel-loader",
                    "eslint-loader",
                ],
            },
        ]
    },

};

index.js文件

import '../vendors/loaders.min.css'
import './reset.css'
import './index.css'
import avReset from './avReset'
import loadSongs from './loadSongs'
import tabs from './tabs'
import searchSongs from './searchSongs'
avReset();
tabs(".tabs",".mainPages");
loadSongs();
searchSongs();

avReset.js文件

export default function avReset() {
    var APP_ID = 'zKM1TH8kc8MSMoh0pd6NcUYY-gzGzoHsz';
    var APP_KEY = 'SutiQq6E6jY1WAwkDOgK4RpB';
    AV.init({
        appId: APP_ID,
        appKey: APP_KEY
    });
}