webpack-contrib / transform-loader

transform loader for webpack
MIT License
110 stars 23 forks source link

Webpack watch mode with html changes doesn't work #24

Open mancioshell opened 7 years ago

mancioshell commented 7 years ago

I have been used for a while browserify and in particular brfs module. Now i have migrated to webpack, but i would to continue to use brfs to laod my html files into JS.

I'm trying to use your loader with this webpack configuration:

module: {
        rules: [{
            test: /\.js$/,
            loader: "transform-loader?brfs",
            enforce: "post"
        }]
    }

For example i have this angular component:

module.exports = {
    bindings: {
      data: '<'
    },
    controller: function(){
     ....
    },
    controllerAs: 'vm',
    template: fs.readFileSync(__dirname + '/create-team-project.html', 'utf8')
};

All this stuff works good, and my bundle load correctly corrensponding html file.

But when i run webpack in watch mode, and if i made some changes on html file, the bundle isn't regenerated. When i used browserify, this behavior didn't happened, so it was able to regenerate bundle on html changes.

How can i have this feature in webpack with your loader?

mancioshell commented 7 years ago

To force webpack to regenerate bundle, i have to edit the JS file thath use with fs.readFileSync the corresponding html file.

Any solutions?

jrichardsz commented 6 years ago

Hi. I have the same problem. My workaround was use CopyWebpackPlugin and register the folder with my html files:

package.json

  "scripts": {
    "start": "webpack --watch"
  }

webpack.config.js

//configuration section
context: path.resolve('./src'),
...
...
//plugin section 
new CopyWebpackPlugin([
  {
    from: './template/**/*',
    to: './'
  }
])

My folder structure is:

package.json
webpack.config.js
/src/template/
/src/template/login.html
/src/template/form.html

Hope this helps