Skip to content

Hot module reloading #7

Description

@guncha

I forked the loader to customize it for our codebase and to add HMR and thought you might find it useful:

module.exports.pitch = function(remainingRequest) {
    this.cacheable()

    var cnames = loaderUtils.stringifyRequest(this, "!" + require.resolve("classnames/bind"))
    var styles = loaderUtils.stringifyRequest(this, "!!" + remainingRequest)

    return `
      if (module.hot) {
        var styles = require(${ styles })
        var classnames = require(${ cnames }).bind(styles)

        var fn = function() {
          return classnames.apply(null, arguments)
        }

        // Allow using this as an ES6 module
        fn.default = fn

        // Allow access to the raw style map
        fn.styles = styles

        module.exports = fn

        module.hot.accept(${ styles }, function() {
          fn.styles = styles = require(${ styles })
          classnames = require(${ cnames }).bind(styles)
        })
      } else {
        module.exports = require(${ cnames }).bind(require(${ styles }))
      }
    `;
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions