neove/webpack-loader-demo

webpack loader

• loader 本质其实是一个函数，在 webpack 构建过程中，当某种类型的资源文件匹配到该 loader 之后，就会调用该函数，并将文件内容作为参数传递进去，loader 负责处理 souce code ，并将处理完结果作为返回值返回。

A loader is a node module that exports a function. This function is called when a resource should be transformed by this loader. The given function will have access to the Loader API using the this context provided to it.

function loader(content) {} // content就是文件内容

webpack-loader

Getting Started

To begin, you'll need to install webpack-loader:

$ npm install webpack-loader --save-dev

Then add the loader to your webpack config. For example:

Then add the plugin to your webpack config. For example:

file.ext

import file from 'file.ext';

webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        test: /.ext$/,
        use: [
          {
            loader: `webpack-loader`,
            options: { ...options },
          },
        ],
      },
    ],
  },
};

webpack.config.js

module.exports = {
  plugins: [
    new `Webpack`Plugin(options)
  ]
}

And run webpack via your preferred method.

Options

[option]

Type: [type|other-type] Default: [type|null]

[ option description ]

webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        loader: `webpack-loader`,
        options: {
          [option]: '',
        },
      },
    ],
  },
};

webpack.config.js

module.exports = {
  plugins: [
    new `Webpack`Plugin({
      [option]: ''
    })
  ]
};

Examples

[ example outline text ]

webpack.config.js

// Example setup here..

file.ext

// Source code here...

bundle.js

// Bundle code here...

Contributing

Please take a moment to read our contributing guidelines if you haven't yet done so.

CONTRIBUTING

License

MIT