微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

未捕获的 ReferenceError:添加 react-hot-loader babel 插件后未定义进程来自 NodeJS.Process

如何解决未捕获的 ReferenceError:添加 react-hot-loader babel 插件后未定义进程来自 NodeJS.Process

我在升级了一些依赖项和包后遇到了这个问题。我希望使用最新版本的 TypeScript,因此我添加了一些 babel 插件并进行了一些其他更改。

我能够编译我的代码,但在运行我的应用程序时出现此控制台错误

Uncaught ReferenceError: process is not defined
    at storeConfig.tsx:4
    at Module../src/store/storeConfig.tsx (bundle.js?4d48cc1c51da72536add:55462)
    at __webpack_require__ (bootstrap:24)
    at fn (hot module replacement:61)
    at Module../src/index.tsx (history.ts:2)
    at __webpack_require__ (bootstrap:24)
    at startup:5
    at startup:6

这是我如何配置我的商店:

import {applyMiddleware,compose,createStore,Store} from "redux";
import thunk from "redux-thunk";
import appReducers,{AppState} from "../combinedReducers";
declare let process: NodeJS.Process;
declare let window: any;

export const middleware = [
    thunk
];

export const configureStore = () => {
    const isDevelopment = process.env.NODE_ENV ===  'development';
    const enhancers: any[] = isDevelopment && window.__Redux_DEVTOOLS_EXTENSION__ && window.__Redux_DEVTOOLS_EXTENSION__() ? [window.__Redux_DEVTOOLS_EXTENSION__()] : [];
    return createStore(
        appReducers,compose(applyMiddleware(thunk),...enhancers)
    ) as Store<AppState>;
};

export default configureStore;

代码之前运行良好。我不确定发生了什么变化。

我会说我在将“react-hot-loader/babel”添加回我的开发 webpack 配置文件插件后确实注意到了这个问题。

 {
                test: /\.tsx$|.ts$/,include: path.join(__dirname,'src'),exclude: /node_modules/,use: {
                    loader: "babel-loader",options: {
                        cacheDirectory: true,babelrc: false,presets: [
                            "@babel/preset-env","@babel/preset-typescript","@babel/preset-react"
                        ],plugins: [
                            ["@babel/plugin-proposal-class-properties",{loose: true}],"@babel/plugin-proposal-numeric-separator","@babel/plugin-transform-typescript","@babel/plugin-proposal-nullish-coalescing-operator","@babel/plugin-proposal-optional-chaining","@babel/plugin-transform-runtime","react-hot-loader/babel"
                        ]
                    }
                }
            },

奇怪的是,如果我从上面的列表中删除插件,它就可以正常工作。但是,我想要热重载功能。有什么想法吗?

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。