Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Inline/hot doesn't work with 2.X #183

Closed
arcanis opened this issue Jan 19, 2016 · 7 comments
Closed

Inline/hot doesn't work with 2.X #183

arcanis opened this issue Jan 19, 2016 · 7 comments

Comments

@arcanis
Copy link

arcanis commented Jan 19, 2016

I'm currently trying to use html-webpack-plugin along with webpack-dev-server, with the inline/hot options enabled. According to what I read on the closed issues, it's not possible with the 1.X releases, but it should with the 2.X. However, I can't figure out how to make it work - would you have some documentation about this?

In my current setup, I'm running the following:

$> npm install html-webpack-plugin@2
$> webpack --inline --hot

However, when I access the dev server root, the inline script hasn't been injected.

@jantimon
Copy link
Owner

Hi @arcanis we just fixed this in #179 - do you use the latest version?

@arcanis
Copy link
Author

arcanis commented Jan 19, 2016

Yep, I'm using the 2.6.5 release. The source code I get is the following:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Webpack App</title>
  <link href="mobile.css" rel="stylesheet"></head>
  <body>
  <script src="mobile.js"></script></body>
</html>

@arcanis
Copy link
Author

arcanis commented Jan 19, 2016

And here is my webpack configuration:

/*global module, require, __dirname*/

var ExtractTextPlugin = require( 'extract-text-webpack-plugin' );
var HtmlWebpackPlugin = require( 'html-webpack-plugin' );

module.exports = {

    resolveLoader : {
        root : __dirname + '/node_modules/'
    },

    resolve : {
        extensions : [ '', '.js' ],
        root : __dirname,
        alias : { 'mobile': __dirname + '/sources/mobile/' }
    },

    entry : {
        'mobile' : 'mobile/index'
    },

    output : {
        path : __dirname + '/builds/',
        filename : '[name].js',
        chunkFilename : '[id].js'
    },

    module : {
        loaders : [ {
            test : /\.less$/,
            loader : ExtractTextPlugin.extract( 'style-loader', 'css-loader!less-loader' )
        } ]
    },

    plugins : [
        new ExtractTextPlugin( '[name].css' ),
        new HtmlWebpackPlugin( )
    ]

};

@jantimon
Copy link
Owner

This is not a valid hot loader config is it?

@arcanis
Copy link
Author

arcanis commented Jan 19, 2016

I think it is - first time I write one, so I'll check. However, the config wasn't the issue - I was :(

For some reason I assumed the inline script would be injected ... well, inline, via a <script/> tag. However, since the way webpack-dev-server works is by adding dependencies to the entry configuration, these scripts are actually directly embedded in the entry files (in my case, mobile.js). Since I was monitoring the DOM tab and not the console (or the network tab), I missed it and thought it wasn't working when it was.

So actually, using 2.6.5, it works fine. Thanks for helping me!

@arcanis arcanis closed this as completed Jan 19, 2016
@jantimon
Copy link
Owner

Happens to all of us :) glad it works

@lock
Copy link

lock bot commented Jun 1, 2018

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

@lock lock bot locked as resolved and limited conversation to collaborators Jun 1, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants