如何修复TypeError：application_module__WEBPACK_IMPORTED_MODULE_1 ___ default.a不是构造函数

Posted 2021-04-03

我有代码生成类的实例，但发生错误

TypeError：application_module__WEBPACK_IMPORTED_MODULE_1 ___ default.a不是构造函数

index.ts

import Application from 'application-module';

const app = new Application();

应用模块

import { IApp, ModuleRoute, IReducerContainer } from 'common-module';

export default class Application implements IApp {
  routes: ModuleRoute[];
  reducers: IReducerContainer[];

  constructor() {
    this.routes = [];
    this.reducers = [];
  }

  addRoute(path: any, component: any) {
    this.routes.push({ path, component });
  }
}

common-module只是功利主义类和接口的列表。

答案

application-module在build/static/js/main-[hash].chunk.js有主要的package.json路径。要解决我的问题，我们需要将其更改为index.js，但它会出现新的错误：

Module parse failed: Unexpected token (10:25)
You may need an appropriate loader to handle this file type.
| import { enhancer } from './store/configureStore';
|
> export class Application implements IApp {

通过编辑webpack.config.js修改它，将include: paths.appSrc更改为include: paths.appPath中的ts-loader。

之后，webpack可以观看我的node_modules，但它发生另一个错误

Uncaught TypeError: Cannot assign to read only property 'exports' of object '#<Object>'

P.S

所以，我在终点线。我的webpack配置无法在.ts目录之外编译src，我决定将.ts代码编译为esnext模块。如果现在连接模块，所有都将成功完成。