什么是webpack
簡(jiǎn)單來(lái)說webpack就是一種模塊加載器兼打包工具趴拧。側(cè)重于模塊加載
webpack如何使用
webpack的使用簡(jiǎn)單來(lái)說就是：
裝webpack，抄webpack文檔(官網(wǎng)上的四個(gè)例子）扩淀，裝webpack插件，抄webpack插件文檔到webpackconfig.js啤挎，最后npm run一下就可以用了驻谆。（具體過程太麻煩了，上面的流程就是最精簡(jiǎn)的了）
舉例說明
在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
});
}
