0

domを変更すると、ページはリフレッシュされますが、css、hmrが変更されます。 私はこれが私のpackage.jsonファイルですwebpack-dev-server CLIのホット・モジュール・リロード・ページのインライン・モードは、変更のためにリフレッシュされます

マックOS 10.11.6、私はDOM

グローバルWebPACKのバージョン3.3.0を変更するとページがホット交換するのではなく、更新されませんしたい:

{ 
    "name": "demo-hmr", 
    "version": "1.0.0", 
    "description": "", 
    "main": "index.js", 
    "scripts": { 
    "test": "echo \"Error: no test specified\" && exit 1", 
    "start": "webpack-dev-server --hot --inline webpack.config.js" 
    }, 
    "keywords": [], 
    "author": "", 
    "license": "MIT", 
    "dependencies": { 
    "babel-core": "^6.26.0", 
    "babel-loader": "^7.1.2", 
    "babel-preset-env": "^1.6.0", 
    "css-loader": "^0.28.7", 
    "style-loader": "^0.18.2", 
    "webpack": "^3.5.6", 
    "webpack-dev-server": "^2.7.1" 
    } 
} 

この私webpack.config.jsファイルです:

module.exports = { 
    entry: './main.js', 
    output: { 
    filename: 'bundle.js' 
    }, 
    module: { 
    rules: [ 
     { 
     test: /\.js$/, 
     exclude: /node_modules/, 
     use: { 
      loader: 'babel-loader' 
     } 
     }, 
     { 
     test: /\.css$/, 
     use: [ 
      'style-loader', 
      'css-loader' 
     ] 
     } 
    ] 
    } 
} 

これは私のmain.jsファイルで、私は、このファイルにDOMを変更します、ちょうどdivvのinnerHTMLを変更し、ページがリフレッシュされ、結果は私が欲しいものではありません。

import app from './app.css' 

var divv = document.createElement('div') 

divv.innerHTML = "Hello webpack" 

document.body.appendChild(divv) 

これは私のapp.cssファイルです:

body { 
    background-color: yellow; 
} 

これは私のindex.htmlファイルです:私の簡単な質問と私のひどい英語&形式について申し訳ありません

<html> 
    <body> 
     <h1>Hello World!</h1> 
    <script type="text/javascript" src="bundle.js"></script> 
    </body> 
</html> 

+0

あなたの英語について心配する必要はありません。この[site](https://www.deepl.com/translator)を使うとかなり良いです。 あなたの質問について私は何が起こっているのか分かりませんが、私はこの[repo](https://github.com/arkgast/webpack-hot-reload)を持っています。 (https://webpack.js.org/guides/getting-started/)それを注意深く見てください。よろしく –

答えて

0

実際、webpackはあなたのモジュールをどのように置き換えたいか分かりにくいです。 css-loaderでは、hmrロジックは既に実装されているので、それは簡単です。しかし、ファイルの場合は、APIを使用してHMRを実装する必要があります。 私はそれほど些細なことではないことに同意します。しかし、それは十分面白いです。

関連する問題