Webpack参考手册

装载 | Loaders

restyle-loader

更新样式 <link>

带有散列值的 hreft值来触发样式重载

安装

npm install --save-dev restyle-loader

用法

文档：使用装载机

例子

webpack.config.js

{
  test: /\.css?$/,
  use: [
    {
      loader: "restyle-loader"
    },
    {
      loader: "file-loader",
      options: {
        name: "[name].css?[hash:8]"
      }
    }
  ]
}

hash 需要启用热模块替换(Hot Module Replacement)

bundle.js

require("./index.css");

// Bundle code here...

index.html

<head>
  <link rel="stylesheet" type="text/css" href="css/index.css">
</head>

装载程序运行后，它变成

<head>
  <link rel="stylesheet" type="text/css" href="css/index.css?531fdfd0">
</head>

装载 | Loaders相关

1.babel-loader
2.bundle-loader
3.cache-loader
4.coffee-loader
5.coffee-redux-loader
6.coverjs-loader
7.css-loader
8.exports-loader
9.expose-loader
10.extract-loader
11.file-loader
12.gzip-loader
13.html-loader
14.i18n-loader
15.imports-loader
16.istanbul-instrumenter-loader
17.jshint-loader
18.json-loader
19.json5-loader
20.less-loader
21.Loaders
22.mocha-loader
23.multi-loader
24.node-loader
25.null-loader
26.polymer-webpack-loader
27.postcss-loader
28.raw-loader
29.react-proxy-loader
30.sass-loader
31.script-loader
32.source-map-loader
33.style-loader
34.svg-inline-loader
35.thread-loader
36.transform-loader
37.url-loader
38.val-loader
39.worker-loader
40.yaml-frontmatter-loader

Webpack

webpack 是一个模块打包器。webpack 处理带有依赖关系的模块，生成一系列表示这些模块的静态资源。

主页	https://webpack.js.org/
源码	https://github.com/webpack/webpack
发布版本	3.8.1

Webpack目录

1.指南 \| Guides
2.接口 \| API
3.概念 \| Concepts
4.组态 \| Configuration
5.装载 \| Loaders