為什么我不能使用webpack捆綁文件中的類？

Question

我是使用webpack的新手。 我正在嘗試使用它來捆綁我的框架。 無論如何我的框架的文件看起來像這樣：

class Rorke {
    constructor(x, y) {
        this.x = x;
        this.y = y;
    }
}

在我的webpack.config.js中：

module.exports = {
  entry: "./src/rorke.js",
  output: {
    filename: "rorke.bundle.js"
  }
}

我的package.json：

{
  "name": "rorke-3.0",
  "version": "1.0.0",
  "description": "",
  "main": "./src/rorke.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "bundle": "webpack ./src/rorke.js dist/rorke.bundle.js"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "webpack": "^4.32.2"
  },
  "dependencies": {
    "pixi.js": "^5.0.3",
    "prototype": "0.0.5"
  }
}

所以我跑：

npm run bundle

它輸出一個捆綁文件。 然后我包括這樣的文件：

<html>
  <body>
    <script src="dist/rorke.bundle.js"></script>
    <script src="game.js"></script>
  </body>
</html>

最后，這是我的game.js：

const game = new Rorke(800, 600);

所以當我打開html文件時，它會告訴我：

Rorke沒有定義

有誰知道為什么會這樣？ 我在這里做錯了什么/不理解？

Answer 1

您需要的一切都在Webpack文檔中：創作庫/暴露庫

Answer 2

開發一個網站實際上只是意味着創建一個HTML文件，一個CSS文件和一個JavaScript文件（有時這些文件是組合在一起的，或者是CSS和JavaScript或組合等）。 這些只是根據請求通過網絡服務器提供的文件。

我認為使用webpack的一個主要原因是遵循require / import語句，這會將跨多個文件的客戶端代碼轉換為單個包。 前端開發工具（例如webpack）允許將這些文件創作為單獨的組件。

Rorke可能是捆綁的。 所以從index.js文件開始，需要/導入你的類，然后使用該類。 然后將您的webpack根目錄更改為index.Js。

為什么我不能使用webpack捆綁文件中的類？

問題描述

2 個解決方案

解決方案1
0 2019-05-26 08:03:34

解決方案2
0 2019-05-26 12:18:53

為什么我不能使用webpack捆綁文件中的類？

問題描述

2 個解決方案

解決方案1 0 2019-05-26 08:03:34

解決方案2 0 2019-05-26 12:18:53

解決方案1
0 2019-05-26 08:03:34

解決方案2
0 2019-05-26 12:18:53