React-Hot-Loader入門

我正嘗試在React中使用React Hot Loader。我通過運行「npm install --save-dev react-hot-loader」來安裝反應熱載入程序。我試圖按照http://gaearon.github.io/react-hot-loader/getstarted/但無法理解。我附上我的webpack.config.js和package.json。我做了文件中列出的更改。但是我無法看到我在動態組件中所做的更改。哪裏不對？React-Hot-Loader入門

webpack.config.js

從的package.json

var path = require('path'); 
var webpack = require('webpack'); 

module.exports = { 
    devServer: { 
     inline: true, 
     contentBase: './src', 
     port: 3000 
    }, 
    devtool: 'cheap-module-eval-source-map', 
    entry: [ 
     'webpack-dev-server/client?http://0.0.0.0:3000', // WebpackDevServer host and port 
     'webpack/hot/only-dev-server', // "only" prevents reload on syntax errors 
     './dev/js/index.js' // Your appʼs entry point 
    ], 
    module: { 
     loaders: [ 
      { 
       test: /\.js$/, 
       loaders: ['react-hot','babel'], 
       exclude: /node_modules/ 
      }, 
      { 
       test: /\.scss/, 
       loader: 'style-loader!css-loader!sass-loader' 
      } 
     ] 
    }, 
    output: { 
     path: 'src', 
     filename: 'js/bundle.min.js' 
    }, 
    plugins: [ 
     new webpack.optimize.OccurrenceOrderPlugin(), 
     new webpack.HotModuleReplacementPlugin() 
    ] 
};

腳本

"scripts": { 
    "dev": "webpack", 
    "start": "webpack-dev-server" 
    }

的index.html

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>React Webpack</title> 
</head> 
<body> 

    <div id="root"></div> 
    <script src="js/bundle.min.js"></script> 

</body> 
</html>

來源

2016-09-01 ApurvG

你遇到的具體問題是什麼？ – lux

我無法按照他們在文檔中提到的步驟操作。我想知道我應該在這兩個文件中進行哪些更改 – ApurvG

哪一步是問題？你在技術上無法理解要做什麼，或者英語不是你的母語嗎？應該提供更多細節，以便人們可以幫助您解決明確的問題。 – lux

好了，現在你需要添加該熱負荷腳本到HTML文件中，右束前，像這樣：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>React Webpack</title> 
</head> 
<body> 

    <div id="root"></div> 

    <script src="http://localhost:3000/webpack-dev-server.js"></script> 
    <script src="js/bundle.min.js"></script> 
</body> 
</html>

這下本地主機：3000，因爲我看到在您的配置的WebPack。我通常只是把它放在8080之下，但我認爲它需要像這樣基於你的配置。

來源

2016-09-01 19:25:15

。但是當我運行「npm start」時，它給了我一個錯誤，說無法找到模塊'/home/apurv/Desktop/React-Redux-Boilerplate-master/server.js'。此外，我添加了我的項目目錄結構。 – ApurvG

另外我附上了我的項目目錄結構。 – ApurvG

這似乎是你從某處導入一個名爲server.js的文件。我沒有看到你的目錄結構，所以我並不驚訝webpack無法找到它。如果您在代碼中搜索導入或需要「服務器」，將顯示webpack正在窒息的文件。 –

React-Hot-Loader入門

回答

相關問題