Webpack TypeScript module.hot 不存在

Question

我想啟用的WebPack HMR在項目的NodeJS寫的打字稿。

但是module.hot不可用：

• @types/webpack-env定義：

   declare var module: __WebpackModuleApi.Module

• 這與@types/node定義沖突：

   declare var module: NodeModule

刪除@types/node ，解決了這個問題，但禁用了process ：

process.env.NODE_ENV === 'production' // [ts] Cannot find name 'process'

Answer 1

正如少數人在這里寫的那樣，這是最好的方法：

npm i -D @types/webpack-env

對我來說，它按預期工作，解決了無法識別hot屬性的問題。

在我的項目中，我使用了這些版本：

"@types/node": "^8.0.19",
"@types/webpack-env": "^1.13.0"

我不知道問題是否仍然是最新的，但是對於我的問題，為 webpack 安裝類型可以幫助我。

Answer 2

沖突解決

@types/webpack-env已更新：

• 在 這個 PR中解決了module沖突

• 在此提交中添加了process

原始問題中的代碼現在只需要@types/webpack-env 。

但是同時導入@types/node不會再發生沖突。

---

安裝

npm install --save-dev @types/webpack-env

如果您還需要 NodeJS 環境定義：

npm install --save-dev @types/node

Answer 3

可能就像在文件頂部添加以下行一樣簡單。

///<reference types="webpack-env" />

Answer 4

您可以增加全局范圍並使用接口合並重新打開NodeModule接口並添加缺少的hot屬性。

import webpack = require("webpack");

declare global {
    interface NodeModule {
        hot: {
            accept(dependencies: string[], callback: (updatedDependencies: string[]) => void): void;
            accept(dependency: string, callback: () => void): void;
            accept(errHandler?: (err: any) => void): void;
            decline(dependencies: string[]): void;
            decline(dependency: string): void;
            decline(): void;

            dispose(callback: (data: any) => void): void;
            addDisposeHandler(callback: (data: any) => void): void;

            removeDisposeHandler(callback: (data: any) => void): void;
            // ...
        }
    }
}

但實際上，這種擴充應該在 Webpack 聲明文件本身中完成。

Answer 5

將 .hot 更改為 ['hot']

if (module.hot) {
    module.hot.accept();
    module.hot.dispose(() => {

使用

if (module['hot']) {
    module['hot'].accept();
    module['hot'].dispose(() => {

Answer 6

這修復了它

yarn add @types/webpack-env --dev

VScode 會立即工作

Intellij 需要重新啟動