raw-loader 学习

[Christian-Yang]

https://github.com/webpack-contrib/raw-loader

raw loader module for webpack webpack的原始加载模块

Raw Loader

A loader for webpack that lets you import files as a string. 用于webpack的加载程序，可以将文件作为字符串导入。

Install

npm install --save-dev raw-loader

Usage

有三种使用方式：
（1）webpack.config.js方式使用
（2）cli命令行方式使用
（3）在import中直接使用

Use the loader either via your webpack config, CLI or inline. 通过webpack配置，CLI或内联使用加载程序。

Via webpack config (recommended)

方式（1）

webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        test: /\.txt$/,
        use: 'raw-loader'
      }
    ]
  }
}

In your application 在你的应用程序中：

import txt from 'file.txt';

CLI

方式（2） webpack --module-bind 'txt=raw-loader' In your application 在你的应用程序中： import txt from 'file.txt';

Inline

方式（3）

In your application

在你的应用程序中： import txt from 'raw-loader!./file.txt';

[Christian-Yang]

webpack starter中的使用方式：

webpack.common.js中的内容：

/**
         * Raw loader support for *.html
         * 原始内容  加载器 用来支持*.html文件
         * Returns file content as string
         * 以字符串string的方式返回文件内容
         * See: https://github.com/webpack/raw-loader
         */
        {
          test: /\.html$/,
          use: 'raw-loader',
          exclude: [helpers.root('src/index.html')]
        },