2021-04-26

最新推荐文章于 2022-11-18 18:31:15 发布

qq_35661140

最新推荐文章于 2022-11-18 18:31:15 发布

阅读量80

点赞数

本文链接：https://blog.csdn.net/qq_35661140/article/details/116144063

版权

编写一个webpack-loader

loader 是导出为一个函数的 node 模块。该函数在 loader 转换资源的时候调用。给定的函数将调用 loader API，并通过 `this` 上下文访问

e.g. ：

loader-txt.js：

import { getOptions } from 'loader-utils'

export default function loader (source, map, meta) {
  const options = getOptions(this)

  source = source.replace(/\[name\]/g, options.name)

  return `export default ${JSON.stringify(source)}`
}

loader 配置：

 // webpack-config.js
 ...  
 module: {
      rules: [{
        test: /\.txt$/,
        use: {
          loader: path.resolve(__dirname, '../src/loader.js'),
          options: {
            name: 'wahaha'
          }
        }
      }]
    }
  ...

结果：

将txt结尾的【name】全部替换为options.name

参考：webpack