2016-11-01 2 views
0

非常にシンプルなWebpackセットアップがあります。自動リロード作業をしようとしています。私は、プロジェクトのルートディレクトリにすべてのファイルを持っています。物事を単純に保つためです。webpack-dev-serverインラインフラグが機能しません

index.html

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <title>Webpack</title> 
    </head> 
    <body>hello</body> 
    <script src="app.js"></script> 
</html> 

webpack.config.js

module.exports = { 
    context: __dirname, 
    entry: { 
    javascript: "./app.js", 
    html: "./index.html", 
    }, 
    output: { 
    filename: "bundle.js" 
    }, 
    watch: true, 
    module: { 
    loaders: [ 
     { 
     test: /\.html$/, 
     loader: "file?name=[name].[ext]", 
     }, 
    ], 
    }, 
} 

app.js

console.log("hello everyone!"); 

のWebPACK実行するには、私が実行します。

$ ./node_modules/.bin/webpack-dev-server --inline 

いずれかのファイルを変更すると、webpack-dev-serverの再コンパイルが正しく動作することがわかります。しかし、新しいコンテンツを更新するためにページ全体を更新する必要があります。 --inlineオプションを使用すると、私はそれをする必要はないと思った。

私はHTMLに以下の行を追加した場合ことが判明:

<script src="http://localhost:8080/webpack-dev-server.js"></script> 

を、その後オートリロードが正常に動作します。それ自体が

  • inlineそれを処理するHTMLを変更しない、レポに入るべきではありません

    • :しかし、HTMLはbecuase、この行を含めることはできませ必要があります。 CLIのパラメータまたはwebpack.config.jsファイルの属性です。私は両方を使いました、どちらも動作しません。

    私はなぜinlineものが動作しないのかわかりません。

  • 答えて

    -1

    Webpack Dev Serverインラインモードは、publicPathに依存します。 webpack.confにpublicPathを追加し、jsファイルのアドレスを<script src="assets/app.js"></script>のように指定することができます。 これでインラインモードが動作します。

    +0

    私はドキュメントから 'publicPath'について知っていますが、まだ私はそこで何を定義するのか分かりません。 SOは、質問と回答の両方に関して、事例に基づいています。あなたの答えは私を助けません - 今のところです。それはコメントかもしれないが、答えはそのままではない – ducin

    関連する問題