contents-file-loader

a webpack loader for emmiting file to dist directory, and returning it's contents on import.

Usage no npm install needed!

<script type="module">
  import contentsFileLoader from 'https://cdn.skypack.dev/contents-file-loader';
</script>

README

A very simple file loader module for webpack, that returns file contents

At this moment, loader supports only files with json content, for example:

{
  "hello": "Hello world!"
}

Requirements

This module was tested with webpack 4.2.0 and higher

Getting Started

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

$ npm install contents-file-loader --save-dev

Import (or require) the target file(s) in one of the bundle's files:

// bundle file
import config from './file.json'

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

// webpack.config.js
module.exports = {
  module: {
    rules: [
      {
        test: /\.json$/, 
        type: 'javascript/auto',               
          use: [
           {         
            loader: "contents-file-loader",                        
           }                   
        ]
      }
    ]
  }
}

You could also specify the name of emitted file:

// webpack.config.js
module.exports = {
  module: {
    rules: [
      {
        test: /\.json$/, 
        type: 'javascript/auto',               
          use: [
           {         
            loader: "contents-file-loader",
            options: {
               name: "[hash].[ext]"
             }                        
           }                   
        ]
      }
    ]
  }
}

And run webpack via your preferred method. This will emit file.json as a file in the output directory and returns contents of the file.

License

MIT