search

leecjson / ref-loader

A webpack loader that will create dependencies between any files manually
MIT License
7 stars 2 forks source link
javascript loader webpack

readme

A webpack loader that will create dependencies between any files manually

Usage

Use @ref(./anyfile.ext) in any text file will build a dependency from current file to anyfile.ext; Then it will replace @ref() markup to module result of anyfile.ext.

Example

// Webpack config
const rules = [
  {
    test: /\.png$/,
    use: [{ loader: 'file-loader'}]
  },
  {
    test: /\.html$/,
    use: [
      { loader: 'file-loader' },
      { loader: 'extract-loader' },
      { loader: 'ref-loader' },
    ]
  }
];
<!-- avatar_page.html -->
<html>
  <img src="https://github.com/leecjson/ref-loader/raw/master/@ref(./avatar.png)" /> 
  <!-- Will change to -->
  <!-- <img src="https://github.com/leecjson/ref-loader/raw/master/a8ea0cfae3d6cfd2f079a9d70ee61a63.png" /> -->
</html>
// index.js
import './avatar_page.html'