亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

使用 webpack 構建 index.html 以與開發服務器一起使用

使用 webpack 構建 index.html 以與開發服務器一起使用

牧羊人nacy 2023-02-17 17:28:46
我使用 webpack 運行我的 Three.js 應用程序,在 webpack.config 文件中具有以下配置:module.exports = {  entry: `${__dirname}/src/tut15.js`,  output: {    path: __dirname + '/dist',    filename: 'index_bundle.js'  },  devtool: 'inline-source-map',  devServer: {    contentBase: path.join(__dirname, 'dist'),    compress: true,    port: 9000  },  plugins: [    new HtmlWebpackPlugin()  ]}包.json  "scripts": {    "start": "webpack-dev-server --open",    "build": "webpack --config webpack.config.babel.js",    "test": "echo \"Error: no test specified\" && exit 1"  },使用HtmlWebpackPlugin它會為我自動生成 html。但是因為我想創建一個帶有一些新標簽的自定義 html 索引文件,所以這對我不起作用。所以我建立了這個項目npm run-script build并使用我應用的編輯手動運行 dist 文件夾中的 index.html,一切正常。如果我從 webpack.config 中刪除 HtmlWebpackPlugin 并再次構建項目然后運行:npm startlivereload 適用于我的 js 文件以及我在 distfolder 中帶有自定義標簽的新 index.html。問題:在 dist 文件夾中創建更改感覺不正確。如何直接從源代碼生成 index.html?我想這可能會解決我能夠使用自定義 index.html 運行開發服務器的所有問題或者是否也可以為構建獲得一些 livereload?在我構建項目后,它會在我的 distfolder 中生成 index.html 和 index.bundle。如果我刪除 index.bundle,該項目仍然有效。index.bundle 究竟做了什么?什么是最好的方法,或者每次我在索引文件中進行更新時都需要構建我的項目?謝謝!
查看完整描述

1 回答

?
夢里花落0921

TA貢獻1772條經驗 獲得超6個贊

至少關于自定義 index.html 和熱重載的問題。


該插件有一些配置,您可以為模板添加。


new HtmlWebPackPlugin({

  filename: 'index.html',

  template: './public/index.html',

}),


查看完整回答
反對 回復 2023-02-17
  • 1 回答
  • 0 關注
  • 217 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號