定制Webpack加载程序的HMR

Question

所以我有一个像这样的自定义文件加载器

config.module
  .rule('myFile')
  .test(/myFile\.js$/)
  .use('myFile-loader')
  .loader(require.resolve('../webpack/myFile-loader'))

myFile-loader

const devalue = require('devalue')
const vm = require('vm');

module.exports = async function(source) {
    const callback = this.async()
    this.addDependency(this.resourcePath);
    const sandbox = {
        require,
        module
    }
    vm.createContext(sandbox);
    const mod = vm.runInContext(source, sandbox)
    const result = await mod(this.resourceQuery.replace('?name=', ''))

    return callback(null, `export default ${devalue(result)}`);
}

this.resourcePath包含以下内容

  const data = Object.assign(
    require("......path/data.js"),
    {}
  )

  module.exports = name => {
    return data[name] && data[name]()
  }

当我运行该应用程序时，导出的值为['far']，但是在向this.resourcePath添加注释后，返回的值变为{}

如果您不知道问题所在，但您有一个最小的示例可以以相同的方式工作，请在评论中发布指向回购协议的链接