子目錄中的Webpack-dev-server - 不編譯和不重新加載

我試圖在子目錄（公共）中運行webpack dev服務器，以便我可以將反應集成到現有站點中。子目錄中的Webpack-dev-server - 不編譯和不重新加載

當我從一個子目錄運行它，使用npm run start，不熱，重裝或編輯工作，但是當我從根目錄下運行它們而不--content-base或devServer.publicPath它工作正常。

文件夾結構 -

|- App/ 
    |- node-modules/ 
    |- public/ 
     |- react/ 
      |- main.js 
     |- index.html 
    |- shared/ 
     |- react/ 
      |- components/ 
      |- main.js 
|- package.json 
|- webpack.config.js

中的index.html包含<script src="react/main.js"></script>

的WebPack配置 -

const path = require('path'); 

const config = { 
    entry: './shared/react/main.js', 
    output: { 
     publicPath: "public/react", 
     path: path.resolve(__dirname, 'public/react'), 
     filename: 'main.js', 
    }, 
    module: { 
     loaders: [ 
      { test: /\.js$/, loader: 'babel-loader', exclude: /node_modules/ }, 
      { test: /\.jsx$/, loader: 'babel-loader', exclude: /node_modules/ } 
     ] 
    }, 
    devServer: { 
      inline: true, 
      publicPath: "public/", 
      contentBase: path.join(__dirname, "public"), 
      hot: true, 
      port: 8080, 
     }, 

}

pacakge.json -

{ 
"name": "App", 
"version": "1.0.0", 
"repository": "Ash-repo", 
"description": "App", 
"devDependencies": { 
    "babel-core": "^6.24.1", 
    "babel-loader": "^7.0.0", 
    "babel-preset-es2015": "^6.24.1", 
    "babel-preset-react": "^6.24.1", 
    "path": "^0.12.7", 
    "react": "^15.5.4", 
    "react-dom": "^15.5.4", 
    "webpack": "^2.5.0", 
    "webpack-dev-server": "^2.4.5" 
}, 
"scripts": { 
    "start": "webpack-dev-server --content-base public/ --hot --progress --colors", 
    "watch": "webpack --progress --colors --watch", 
    "test": "echo \"Error: no test specified\" && exit 1" 
} 
}

不能看到w ^它不是編譯或重新加載，我已經建立了publicPath（在輸出和devServer）和content-base指向公衆。我看着http://localhost:8080/webpack-dev-server/和，但沒有重新加載或編譯！

任何幫助將不勝感激！

來源

2017-05-19 Ash

更新的devServer historyApiFallback中的WebPack配置文件：{ disableDotRule：真 } 更新腳本：的WebPack-DEV-服務器--content基地公共/ --hot --progress --colors - 歷史-api-fallback – Kasiriveni

@Kasiriveni感謝您的幫助！只是嘗試過，但沒有運氣！ – Ash

webpack配置似乎不正確。使用下面的webpack配置將在子目錄下啓用熱重載。

const path = require('path'); 
const config = { 
    entry: './shared/react/main.js', 
    output: { 
     publicPath: "public/react", 
     path: path.resolve(__dirname, 'public/react'), 
     filename: 'main.js', 
    }, 
    module: { 
     loaders: [ 
      { test: /\.js$/, loader: 'babel-loader', exclude: /node_modules/ }, 
      { test: /\.jsx$/, loader: 'babel-loader', exclude: /node_modules/ } 
     ] 
    }, 
    devServer: { 
     inline: true, 
     publicPath: "/react/", 
     contentBase: path.join(__dirname, "public"), 
     hot: true, 
     port: 8070 
    } 
}

devServer.publicPath是這裏最重要的變化。欲瞭解更多信息，請訪問webpack的官方文檔here

我希望這有助於！

來源

2018-02-20 19:11:36

子目錄中的Webpack-dev-server - 不編譯和不重新加載

回答

相關問題