TypeScript编译为JavaScript时出现exports未定义错误求助
问题解决:Uncaught ReferenceError: exports is not defined
这个错误的核心原因是:TypeScript默认编译出了CommonJS模块语法(exports、require),但浏览器原生环境并不支持这种模块系统,导致找不到exports全局变量。
解决方案一:改用ES模块(推荐,原生支持)
- 修改tsconfig.json,在
compilerOptions中添加module配置,指定使用ES模块规范:
{ "compilerOptions": { "noImplicitAny": false, "noEmitOnError": true, "removeComments": false, "sourceMap": true, "target": "es5", "module": "ESNext", // 也可指定为ES6/ES2015,根据目标浏览器兼容性调整 "outDir": "wwwroot/js" }, "include": [ "TSScripts/**/*" ], "exclude": [ "node_modules", "wwwroot" ] }
- 重新编译TypeScript代码,生成的JS文件会使用ES模块的
import/export语法。 - 在HTML中引入JS文件时必须添加
type="module":
<script type="module" src="wwwroot/js/Partenaires.js"></script>
解决方案二:使用打包工具(适合复杂项目)
如果项目涉及多模块依赖,推荐使用Webpack、Vite等打包工具。这类工具会将所有模块打包成浏览器可直接识别的单文件或兼容模块,同时自动处理语法兼容性问题。
解决方案三:移除模块系统(仅适合简单场景)
若不需要模块化结构,可直接将代码放在全局作用域:
- 修改
PartenaireTSModel.ts,移除export关键字:
namespace Partenaires { export class Partenaire { private _IdPartenaire : number; private _DateCreation : Date; public get IdPartenaire(){ return this._IdPartenaire; } public set IdPartenaire(idPartenaire: number){ this._IdPartenaire = idPartenaire; } public get DateCreation(){ return this._DateCreation; } public set DateCreation(dateCreation: Date){ this._DateCreation = dateCreation; } } }
- 修改
Partenaires.ts,移除import语句:
let partenaire = new Partenaires.Partenaire(); partenaire.IdPartenaire = 12;
- 在HTML中按依赖顺序引入编译后的JS文件:
<script src="wwwroot/js/Models/PartenaireTSModel.js"></script> <script src="wwwroot/js/Partenaires.js"></script>
内容的提问来源于stack exchange,提问作者philippedesmarez
相关产品推荐
相关产品推荐

