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

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

Webpack 沒有構建最新的更改

Webpack 沒有構建最新的更改

慕村9548890 2022-10-21 10:37:25
我正在做一個來自https://medium.com/ethereum-developers/the-ultimate-end-to-end-tutorial-to-create-and-deploy-a-fully-descentralized-dapp-in的相當簡單的項目-ethereum-18f0cf6d7e0e由于本教程不關注前端部分(webpack 和 babel 等),我從不同的地方挑選了這些步驟?,F在我嘗試使用 webpack 和 http-server 構建前端,但我意識到它并沒有隨著我對文件所做的更改而更新。webpack.config.jsconst path = require('path')module.exports = {   entry: path.join(__dirname, 'src/js', 'index.js'), // Our frontend will be inside the src folder   output: {      path: path.join(__dirname, 'dist'),      filename: 'build.js' // The final file will be created in dist/build.js   },   module: {      rules: [{         test: /\.css$/, // To load the css in react         use: ['style-loader', 'css-loader'],         include: /src/      }, {         test: /\.jsx?$/, // To load the js and jsx files         loader: 'babel-loader',         exclude: /node_modules/,         query: {            presets: ['@babel/preset-env', '@babel/preset-react']         }      }]   }}包.json{  "name": "test-app",  "version": "1.0.0",  "main": "index.js",  "scripts": {    "test": "echo \"Error: no test specified\" && exit 1"  },  "keywords": [],  "author": "",  "license": "ISC",  "devDependencies": {    "@babel/core": "^7.10.2",    "@babel/preset-env": "^7.10.2",    "@babel/preset-react": "^7.10.1",    "babel-loader": "^8.1.0",    "css-loader": "^3.5.3",    "json-loader": "^0.5.7",    "react": "^16.13.1",    "react-dom": "^16.13.1",    "style-loader": "^1.2.1",    "web3": "^0.20.0",    "webpack": "^4.43.0",    "webpack-cli": "^3.3.11"  },  "directories": {    "test": "test"  },  "dependencies": {},  "description": ""}我使用它構建它 npx webpack --config webpack.config.js  然后上桌 http-server dist/我該如何解決?這甚至是正確的方法嗎?謝謝。
查看完整描述

1 回答

?
慕尼黑8549860

TA貢獻1818條經驗 獲得超11個贊

你已經在你的依賴項中安裝了 webpack-cli,所以你不必在命令中添加配置:


首先在你的 Package.json 中添加 Webpack 腳本:


  "scripts": {

    "watch": "webpack --watch",

  },

當你運行npm run watch--watch webpack 將繼續觀察任何已解析文件的變化。


對于服務器,我推薦你webpack-dev-server


npm i webpack-dev-server

可用于快速開發應用程序


module.exports = {

  //...

  devServer: {

    contentBase: path.join(__dirname, 'dist'),

    compress: true,

    port: 9000

  }

};

并將其添加到您的 npm 腳本中


 "scripts": {

        "watch": "webpack --watch",

        "start": "webpack-dev-server --hot --open",

      }

現在我們可以run npm start從命令行看到我們的瀏覽器自動加載我們的頁面。如果您現在更改任何源文件并保存它們,Web 服務器將在代碼編譯后自動重新加載。


建議:您必須在 dist 或插件中添加 html 文件以用于 webpack HtmlWebpackPlugin


查看完整回答
反對 回復 2022-10-21
  • 1 回答
  • 0 關注
  • 113 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

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

公眾號

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