blocks|key|2644529|text|编辑：|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|2644530|如果你不再以es5为目标，这个答案可能不起作用，我会试着让答案更完整。|CODE|2644531|原始答案|2644532|如果未安装CommonJS+(which+defines+exports)，则必须从tsconfig.json中删除此行|2644533|+"module":+"commonjs",|code-block|syntax|javascript|2644534|根据评论，这可能不适用于更高版本的tsc。如果是这种情况，您可以安装一个模块加载器，如CommonJS、SystemJS或RequireJS，然后指定它。|2644535|备注：|2644536|看看tsc生成的main.js文件。你会在最上面找到这个：|2644537|Object.defineProperty(exports,+"__esModule",+{+value:+true+});|2644538|它是错误消息的根源，在删除"module":+"commonjs",之后，它将消失。|2644539|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/Microsoft/TypeScript/issues/15685^0|0|3|0|6|3|0|0|4|0|T|7|16|D|F|L|0|0|0|H|3|0|0|3|0|2|3|8|7|0|0|D|L|0^^$0|@$1|2|3|4|5|6|7|19|8|@$9|1A|A|1B|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|1C|8|@$9|1D|A|1E|B|H]]|D|@]|E|$]]|$1|I|3|J|5|6|7|1F|8|@$9|1G|A|1H|B|C]]|D|@]|E|$]]|$1|K|3|L|5|6|7|1I|8|@$9|1J|A|1K|B|H]|$9|1L|A|1M|B|H]]|D|@$9|1N|A|1O|1|1P]]|E|$]]|$1|M|3|N|5|O|7|1Q|8|@]|D|@]|E|$P|Q]]|$1|R|3|S|5|6|7|1R|8|@$9|1S|A|1T|B|H]]|D|@]|E|$]]|$1|T|3|U|5|6|7|1U|8|@$9|1V|A|1W|B|C]]|D|@]|E|$]]|$1|V|3|W|5|6|7|1X|8|@$9|1Y|A|1Z|B|H]|$9|20|A|21|B|H]]|D|@]|E|$]]|$1|X|3|Y|5|O|7|22|8|@]|D|@]|E|$P|Q]]|$1|Z|3|10|5|6|7|23|8|@$9|24|A|25|B|H]]|D|@]|E|$]]|$1|11|3|-4|5|6|7|26|8|@]|D|@]|E|$]]]|12|$13|$5|14|15|16|E|$17|18]]]]

EDIT:
This answer might not work depending if you're not targeting <code>es5</code> anymore, I'll try to make the answer more complete.
Original Answer
If CommonJS isn't installed (<a href="https://github.com/Microsoft/TypeScript/issues/15685" rel="noreferrer">which defines <code>exports</code></a>), you have to remove this line from your <code>tsconfig.json</code>:
<pre><code> &quot;module&quot;: &quot;commonjs&quot;,
</code></pre>
As per the comments, this alone may not work with later versions of <code>tsc</code>. If that is the case, you can install a module loader like CommonJS, SystemJS or RequireJS and then specify that.
Note:
Look at your <code>main.js</code> file that <code>tsc</code> generated. You will find this at the very top:
<pre><code>Object.defineProperty(exports, &quot;__esModule&quot;, { value: true });
</code></pre>
It is the root of the error message, and after removing <code>&quot;module&quot;: &quot;commonjs&quot;,</code>, it will vanish.

blocks|key|2644601|text|这个问题的其他解决方案很少|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2644602|2644603|在对Javascript的其他引用之前添加以下行。这是一个不错的小技巧。|unordered-list-item|2644604|2644605|+++<script>var+exports+=+{};</script>|code-block|syntax|javascript|2644606|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|O|8|@]|9|@]|A|$]]|$1|C|3|D|5|E|7|P|8|@]|9|@]|A|$]]|$1|F|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|G|3|H|5|I|7|R|8|@]|9|@]|A|$J|K]]|$1|L|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|M|$]]

Few other Solutions for this issue
<ul>
<li>Add the following line before other references to Javascript. This is a nice little hack.</li>
</ul>
<pre class="lang-html prettyprint-override"><code> &lt;script&gt;var exports = {};&lt;/script&gt;
</code></pre>

blocks|key|2644836|text|一种解决方案：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2644837|从package.json中删除"type":+"module"。|offset|length|style|CODE|2644838|entityMap^0|0|1|C|G|G|0^^$0|@$1|2|3|4|5|6|7|J|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|K|8|@$D|L|E|M|F|G]|$D|N|E|O|F|G]]|9|@]|A|$]]|$1|H|3|-4|5|6|7|P|8|@]|9|@]|A|$]]]|I|$]]

<h1>A solution:</h1>
Remove <code>&quot;type&quot;: &quot;module&quot;</code> from <code>package.json</code>.

blocks|key|104436|text|npm+install+@babel/plugin-transform-modules-commonjs|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|104437|添加到.babelrc插件解决了我的问题。|104438|entityMap^0|0|1G|0|0^^$0|@$1|2|3|4|5|6|7|J|8|@$9|K|A|L|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|M|8|@]|D|@]|E|$]]|$1|H|3|-4|5|6|7|N|8|@]|D|@]|E|$]]]|I|$]]

<code>npm install @babel/plugin-transform-modules-commonjs</code> 

and add to to .babelrc plugins resolved my question.

blocks|key|104526|text|通过将module编译器选项设置为es6可修复此问题|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|104527|{
++"compilerOptions":+{+++++
++++"module":+"es6",
++++"target":+"es5",++++
++}
}|code-block|syntax|javascript|104528|entityMap^0|3|6|H|3|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]|$9|P|A|Q|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|R|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|S|8|@]|D|@]|E|$]]]|L|$]]

This is fixed by setting the <code>module</code> compiler option to <code>es6</code>:

<pre><code>{
 "compilerOptions": { 
 "module": "es6",
 "target": "es5", 
 }
}
</code></pre>

blocks|key|2856107|text|我的解决方案是以上所有内容的总结，我添加了一些小技巧，基本上我将此添加到我的html代码中|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2856108|<script>var+exports+=+{"__esModule":+true};</script>
<script+src="js/file.js"></script>|code-block|syntax|javascript|2856109|这甚至允许你使用import而不是require，如果你使用电子或其他什么，它在typescript+3.5.1，target:+es3+->+esnext上工作得很好。|offset|length|style|CODE|2856110|entityMap^0|0|0|8|6|H|7|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@$I|R|J|S|K|L]|$I|T|J|U|K|L]]|9|@]|A|$]]|$1|M|3|-4|5|6|7|V|8|@]|9|@]|A|$]]]|N|$]]

my solution is a sum up of everything above with little tricks I added, basically I added this to my html code

<pre class="lang-html prettyprint-override"><code>&lt;script&gt;var exports = {"__esModule": true};&lt;/script&gt;
&lt;script src="js/file.js"&gt;&lt;/script&gt;
</code></pre>

this even allows you to use <code>import</code> instead of <code>require</code> if you're using electron or something, and it works fine with typescript 3.5.1, target: es3 -> esnext.

blocks|key|2856023|text|我也遇到了同样的问题，并将"es5“库添加到tsconfig.json中，如下所示：|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|2856024|{
++++"compilerOptions":+{
++++++++"target":+"es5",+//defines+what+sort+of+code+ts+generates,+es5+because+it's+what+most+browsers+currently+UNDERSTANDS.
++++++++"module":+"commonjs",
++++++++"moduleResolution":+"node",
++++++++"sourceMap":+true,
++++++++"emitDecoratorMetadata":+true,+//for+angular+to+be+able+to+use+metadata+we+specify+in+our+components.
++++++++"experimentalDecorators":+true,+//angular+needs+decorators+like+@Component,+@Injectable,+etc.
++++++++"removeComments":+false,
++++++++"noImplicitAny":+false,
++++++++"lib":+[
++++++++++++"es2016",
++++++++++++"dom",
++++++++++++"es5"
++++++++]
++++}
}|code-block|syntax|javascript|2856025|entityMap^0|E|3|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

I had the same problem and solved it adding "es5" library to tsconfig.json like this:

<pre><code>{
 "compilerOptions": {
 "target": "es5", //defines what sort of code ts generates, es5 because it's what most browsers currently UNDERSTANDS.
 "module": "commonjs",
 "moduleResolution": "node",
 "sourceMap": true,
 "emitDecoratorMetadata": true, //for angular to be able to use metadata we specify in our components.
 "experimentalDecorators": true, //angular needs decorators like @Component, @Injectable, etc.
 "removeComments": false,
 "noImplicitAny": false,
 "lib": [
 "es2016",
 "dom",
 "es5"
 ]
 }
}
</code></pre>

blocks|key|107114|text|对于仍然有这个问题的人，如果你的编译器目标设置为ES6，你需要告诉babel跳过模块转换。要执行此操作，请将以下代码添加到.babelrc文件|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|107115|{
++"presets":+[+["env",+{"modules":+false}+]]
}|code-block|syntax|javascript|107116|entityMap^0|1P|8|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

For people still having this issue, if your compiler target is set to ES6 you need to tell babel to skip module transformation. To do so add this to your <code>.babelrc</code> file

<pre><code>{
 "presets": [ ["env", {"modules": false} ]]
}
</code></pre>

blocks|key|2856133|text|我也犯了同样的错误。在我的例子中，这是因为我们在TypeScript+AngularJS项目中有一个老式的导入语句，如下所示：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2856134|import+{+IAttributes,+IScope+}+from+"angular";|code-block|syntax|javascript|2856135|被编译成JavaScript，如下所示：|2856136|"use+strict";
Object.defineProperty(exports,+"__esModule",+{+value:+true+});|2856137|这在过去是需要的，因为我们在代码中使用了IAttributes，否则TypeScript将不知道如何处理它。但是在删除导入语句并将IAttributes转换为ng.IAttributes之后，这两个JavaScript行就消失了--错误消息也消失了。|offset|length|style|CODE|2856138|entityMap^0|0|0|0|0|K|B|1T|B|27|E|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|W|8|@$M|X|N|Y|O|P]|$M|Z|N|10|O|P]|$M|11|N|12|O|P]]|9|@]|A|$]]|$1|Q|3|-4|5|6|7|13|8|@]|9|@]|A|$]]]|R|$]]

I had this same error too. In my case it was because we had an old-fashioned import statement in our TypeScript AngularJS project like this:

<pre><code>import { IAttributes, IScope } from "angular";
</code></pre>

which was compiled to JavaScript like this:

<pre><code>"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
</code></pre>

This was needed back in the old days because we then used <code>IAttributes</code> in the code and TypeScript wouldn't have known what to do with it otherwise.
But after removing the import statement, and converting <code>IAttributes</code> to <code>ng.IAttributes</code> those two JavaScript lines disappeared - and so did the error message.

blocks|key|2644803|text|对我来说，从tsconfig.json中删除"esModuleInterop":+true做到了这一点。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2644804|entityMap^0|M|N|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|K|8|@]|D|@]|E|$]]]|G|$]]

for me, removing <code>"esModuleInterop": true</code> from tsconfig.json did the trick.

blocks|key|107180|text|只需添加libraryTarget:+'umd'，如下所示|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|107181|const+webpackConfig+=+{
++output:+{
++++libraryTarget:+'umd'+//+Fix:+"Uncaught+ReferenceError:+exports+is+not+defined".
++}
};

module.exports+=+webpackConfig;+//+Export+all+custom+Webpack+configs.|code-block|syntax|javascript|107182|entityMap^0|4|K|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

Simply add <code>libraryTarget: 'umd'</code>, like so

<pre><code>const webpackConfig = {
 output: {
 libraryTarget: 'umd' // Fix: "Uncaught ReferenceError: exports is not defined".
 }
};

module.exports = webpackConfig; // Export all custom Webpack configs.
</code></pre>

blocks|key|104694|text|我有类似的问题，因为原来的问题发帖：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|104695|我最好告诉你我犯了什么错误，以及我是如何改正的，这可能会对某些人有所帮助。|104696|我有一个javascript+nodejs项目，并将其转换为typescript。|104697|以前在package.json中，当我在JavaScript中运行时，会有“类型”：“模块”。|104698|当我将其转换为TypeScript项目，并开始转换.ts文件中的文件，并使用以下命令开始运行时：|104699|npx+tsc+test.ts+&&+node+test.ts|code-block|syntax|javascript|104700|我会得到上面的错误。|104701|我只需从package.json中删除"type":"module“就可以消除这个错误|104702|我的tsconfig.json如下所示：|104703|{
++++"compilerOptions":+{
++++++++"target":+"esnext",
++++++++"lib":+["es6",+"es5",+"es7",+"dom"],
++++++++"allowJs":+true,
++++++++"esModuleInterop":+true,
++++++++"allowSyntheticDefaultImports":+true,
++++++++"strict":+true,
++++++++"forceConsistentCasingInFileNames":+true,
++++++++"module":+"es6",
++++++++"outDir":+"./build",
++++++++"moduleResolution":+"node",
++++++++"resolveJsonModule":+true,
++++++++"skipLibCheck":+true
++++},
++++"exclude":+["node_modules",+"build"]|104704|我使用的是节点14和TypeScript+4.2.4|104705|entityMap^0|0|0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|10|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|11|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|12|8|@]|9|@]|A|$]]|$1|F|3|G|5|6|7|13|8|@]|9|@]|A|$]]|$1|H|3|I|5|6|7|14|8|@]|9|@]|A|$]]|$1|J|3|K|5|L|7|15|8|@]|9|@]|A|$M|N]]|$1|O|3|P|5|6|7|16|8|@]|9|@]|A|$]]|$1|Q|3|R|5|6|7|17|8|@]|9|@]|A|$]]|$1|S|3|T|5|6|7|18|8|@]|9|@]|A|$]]|$1|U|3|V|5|L|7|19|8|@]|9|@]|A|$M|N]]|$1|W|3|X|5|6|7|1A|8|@]|9|@]|A|$]]|$1|Y|3|-4|5|6|7|1B|8|@]|9|@]|A|$]]]|Z|$]]

I had similar issue as the original poster of the question:
I better tell you what mistakes I made and how I corrected it, that might help someone.
I had javascript nodejs project and converted it to typescript.
Previously in package.json I had &quot;type&quot;:&quot;module&quot; when I was running in JavaScript.
When I converted it to TypeScript project and started converting files in .ts files and started running using following command:
<pre><code>npx tsc test.ts &amp;&amp; node test.ts
</code></pre>
I would get the above error.
I got rid of the error by simply removing the &quot;type&quot;:&quot;module&quot; from package.json
My tsconfig.json would like below:
<pre><code>{
 &quot;compilerOptions&quot;: {
 &quot;target&quot;: &quot;esnext&quot;,
 &quot;lib&quot;: [&quot;es6&quot;, &quot;es5&quot;, &quot;es7&quot;, &quot;dom&quot;],
 &quot;allowJs&quot;: true,
 &quot;esModuleInterop&quot;: true,
 &quot;allowSyntheticDefaultImports&quot;: true,
 &quot;strict&quot;: true,
 &quot;forceConsistentCasingInFileNames&quot;: true,
 &quot;module&quot;: &quot;es6&quot;,
 &quot;outDir&quot;: &quot;./build&quot;,
 &quot;moduleResolution&quot;: &quot;node&quot;,
 &quot;resolveJsonModule&quot;: true,
 &quot;skipLibCheck&quot;: true
 },
 &quot;exclude&quot;: [&quot;node_modules&quot;, &quot;build&quot;]

</code></pre>
I am using node 14 and TypeScript 4.2.4

blocks|key|107332|text|我在几周前遇到了这个问题，并在短期内使用了the+exports+hack+above，但最终找到了另一种对我很有效的方法来解决这个问题。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|107333|因此，与上面的一些其他响应不同，我实际上希望我正在编译的代码成为一个模块。通过设置"target":+"es6",+"module":+"esnext"，然后使用type="module"而不是type="text/javascript"链接到我编译的JS文件，我的编译代码不再有Object.defineProperty(exports,+"__esModule",+{+value:+true+});行，它仍然是一个模块|style|CODE|107334|我的tsconfig：|107335|{
++"compilerOptions":+{
++++"target":+"es6",
++++"experimentalDecorators":+true,
++++"emitDecoratorMetadata":+true,
++++"module":+"esnext",
++++"moduleResolution":+"node",
++++"lib":+["es2016",+"esnext",+"dom"],
++++"outDir":+"build",
++++"strict":+true,
++++"strictNullChecks":+true,
++++"esModuleInterop":+true,
++++"forceConsistentCasingInFileNames":+true,
++++"declaration":+true,
++},
++"include":+["src/index.ts"],
++"exclude":+["build"]
}|code-block|syntax|javascript|107336|我在超文本标记语言head标记中指向编译代码的链接：|107337|<script+src="../build/index.js"+type="module"+defer></script>|107338|另外，我现在还可以在主HTML+body代码下面的单独type="module"脚本中导入在该index.js文件中导出的任何内容：|107339|+<script+type="module">
+++import+{+coolEncodingFunction,+coolDecodingFunction+}+from+"../build/index.js";
+++/*+Do+stuff+with+coolEncodingFunction+and+coolDecodingFunction+*/
+++/*+...+*/
</script>|107340|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/a/46887516/10210463^0|L|M|0|0|15|G|1M|I|29|D|2P|M|3W|1Q|0|0|0|9|4|0|0|G|4|R|D|0|0^^$0|@$1|2|3|4|5|6|7|14|8|@]|9|@$A|15|B|16|1|17]]|C|$]]|$1|D|3|E|5|6|7|18|8|@$A|19|B|1A|F|G]|$A|1B|B|1C|F|G]|$A|1D|B|1E|F|G]|$A|1F|B|1G|F|G]|$A|1H|B|1I|F|G]]|9|@]|C|$]]|$1|H|3|I|5|6|7|1J|8|@]|9|@]|C|$]]|$1|J|3|K|5|L|7|1K|8|@]|9|@]|C|$M|N]]|$1|O|3|P|5|6|7|1L|8|@$A|1M|B|1N|F|G]]|9|@]|C|$]]|$1|Q|3|R|5|L|7|1O|8|@]|9|@]|C|$M|N]]|$1|S|3|T|5|6|7|1P|8|@$A|1Q|B|1R|F|G]|$A|1S|B|1T|F|G]]|9|@]|C|$]]|$1|U|3|V|5|L|7|1U|8|@]|9|@]|C|$M|N]]|$1|W|3|-4|5|6|7|1V|8|@]|9|@]|C|$]]]|X|$Y|$5|Z|10|11|C|$12|13]]]]

I ran into this issue a few weeks ago and used <a href="https://stackoverflow.com/a/46887516/10210463">the exports hack above</a> in the short term but finally figured out another way around this that's working great for me.
So unlike some of the other responses above, I actually wanted the code I'm compiling to be a module. By setting <code>&quot;target&quot;: &quot;es6&quot;,</code> <code>&quot;module&quot;: &quot;esnext&quot;</code> and then linking to my compiled JS file with <code>type=&quot;module&quot;</code> instead of <code>type=&quot;text/javascript&quot;</code>, my compiled code no longer has the <code>Object.defineProperty(exports, &quot;__esModule&quot;, { value: true });</code> line and it's still a module 
My tsconfig:
<pre><code>{
 &quot;compilerOptions&quot;: {
 &quot;target&quot;: &quot;es6&quot;,
 &quot;experimentalDecorators&quot;: true,
 &quot;emitDecoratorMetadata&quot;: true,
 &quot;module&quot;: &quot;esnext&quot;,
 &quot;moduleResolution&quot;: &quot;node&quot;,
 &quot;lib&quot;: [&quot;es2016&quot;, &quot;esnext&quot;, &quot;dom&quot;],
 &quot;outDir&quot;: &quot;build&quot;,
 &quot;strict&quot;: true,
 &quot;strictNullChecks&quot;: true,
 &quot;esModuleInterop&quot;: true,
 &quot;forceConsistentCasingInFileNames&quot;: true,
 &quot;declaration&quot;: true,
 },
 &quot;include&quot;: [&quot;src/index.ts&quot;],
 &quot;exclude&quot;: [&quot;build&quot;]
}
</code></pre>
My link to my compiled code in HTML <code>head</code> tags:
<pre><code>&lt;script src=&quot;../build/index.js&quot; type=&quot;module&quot; defer&gt;&lt;/script&gt;
</code></pre>
As a bonus, now I can also import anything that I export in that index.js file in a separate <code>type=&quot;module&quot;</code> script down below the main HTML <code>body</code> code:
<pre><code> &lt;script type=&quot;module&quot;&gt;
 import { coolEncodingFunction, coolDecodingFunction } from &quot;../build/index.js&quot;;
 /* Do stuff with coolEncodingFunction and coolDecodingFunction */
 /* ... */
&lt;/script&gt;
</code></pre>

blocks|key|107337|text|in+package.json+add+-+in+"type":+"module"+in+terminal键入in|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|107338|npx+tsc+--init|code-block|syntax|javascript|107339|它将创建一个tsconfig.json+change+"target":+"es5"+to+"target":+"es6"|107340|注释掉//"module":+"commonjs",取消注释"moduleResolution":+"node",|107341|您应该可以在package.json中创建构建脚本|107342|"build":+"tsc+-p+tsconfig.json"|107343|然后，当您想要构建时，只需编译npm+run+build|107344|然后执行，并且应该是好的|107345|entityMap^0|P|G|0|0|R|F|1A|F|0|3|N|U|R|0|0|0|V|0|F|D|0|0^^$0|@$1|2|3|4|5|6|7|Y|8|@$9|Z|A|10|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|11|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|12|8|@$9|13|A|14|B|C]|$9|15|A|16|B|C]]|D|@]|E|$]]|$1|M|3|N|5|6|7|17|8|@$9|18|A|19|B|C]|$9|1A|A|1B|B|C]]|D|@]|E|$]]|$1|O|3|P|5|6|7|1C|8|@]|D|@]|E|$]]|$1|Q|3|R|5|6|7|1D|8|@$9|1E|A|1F|B|C]]|D|@]|E|$]]|$1|S|3|T|5|6|7|1G|8|@$9|1H|A|1I|B|C]]|D|@]|E|$]]|$1|U|3|V|5|6|7|1J|8|@]|D|@]|E|$]]|$1|W|3|-4|5|6|7|1K|8|@]|D|@]|E|$]]]|X|$]]

in package.json add in
<code>&quot;type&quot;: &quot;module&quot;</code>
in terminal type in
<pre><code>npx tsc --init
</code></pre>
it will create a tsconfig.json
change
<code>&quot;target&quot;: &quot;es5&quot;</code>
to
<code>&quot;target&quot;: &quot;es6&quot;</code>
comment out
<code>//&quot;module&quot;: &quot;commonjs&quot;,</code>
uncomment
<code>&quot;moduleResolution&quot;: &quot;node&quot;,</code>
you should be good to go
in package.json create a build script
<code>&quot;build&quot;: &quot;tsc -p tsconfig.json&quot;</code>
then when you want to build you just compile
<code>npm run build</code>
then execute and should be good

blocks|key|104484|text|对于某些ASP.NET项目，您的Typescripts中可能根本不会使用import和export。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|104485|当我尝试这样做时，问题的错误出现了，我后来才发现，我只需要像这样将生成的JS脚本添加到视图中：|104486|<script+src="~/scripts/js/[GENERATED_FILE].Index.js"+asp-append-version="true"></script>|code-block|syntax|javascript|104487|entityMap^0|10|6|17|6|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]|$9|R|A|S|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|T|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|U|8|@]|D|@]|E|$K|L]]|$1|M|3|-4|5|6|7|V|8|@]|D|@]|E|$]]]|N|$]]

For some ASP.NET projects <code>import</code> and <code>export</code> may not be used at all in your Typescripts.

The question's error showed up when I attempted to do so and I only discovered later that I just needed to add the generated JS script to the View like so:

<pre><code>&lt;script src="~/scripts/js/[GENERATED_FILE].Index.js" asp-append-version="true"&gt;&lt;/script&gt;
</code></pre>

blocks|key|2644870|text|注意:这可能不适用于OP的答案，但我得到了这个错误，这是我解决它的方法。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2644871|所以我面临的问题是，当我从一个特定的CDN中检索一个'js‘库时，我得到了这个错误。|2644872|我所做的唯一错误的事情就是像这样从CDN的cjs目录导入：https://cdn.jsdelivr.net/npm/@popperjs/core@2.4.0/dist/cjs/popper.min.js|offset|length|style|CODE|2644873|注意到dist/cjs部分了吗？这就是问题所在。|2644874|我返回到我的案例中的CDN+(jsdelivr)并导航到umd文件夹。我可以找到另一组要导入的正确文件：https://cdn.jsdelivr.net/npm/@popperjs/core@2.4.0/dist/umd/popper.min.js。|2644875|entityMap^0|0|0|L|3|T|20|0|3|8|0|S|3|1G|20|0^^$0|@$1|2|3|4|5|6|7|P|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|Q|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|R|8|@$F|S|G|T|H|I]|$F|U|G|V|H|I]]|9|@]|A|$]]|$1|J|3|K|5|6|7|W|8|@$F|X|G|Y|H|I]]|9|@]|A|$]]|$1|L|3|M|5|6|7|Z|8|@$F|10|G|11|H|I]|$F|12|G|13|H|I]]|9|@]|A|$]]|$1|N|3|-4|5|6|7|14|8|@]|9|@]|A|$]]]|O|$]]

Note: This might not be applicable for OP's answer, but I was getting this error, and this how I solved it. 

So the problem that I was facing was that I was getting this error when I retrieved a 'js' library from a particular CDN. 

The only wrong thing that I was doing was importing from the CDN's <code>cjs</code> directory like so:
<code>https://cdn.jsdelivr.net/npm/@popperjs/core@2.4.0/dist/cjs/popper.min.js</code>

Notice the <code>dist/cjs</code> part? That's where the problem was. 

I went back to the CDN (jsdelivr) in my case and navigated to find the <code>umd</code> folder. And I could find another set of <code>popper.min.js</code> which was the correct file to import:
<code>https://cdn.jsdelivr.net/npm/@popperjs/core@2.4.0/dist/umd/popper.min.js</code>.

blocks|key|2644911|text|要解决此问题，请将这两行放入您的index.html页面。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2644912|<script>var+exports+=+{"__esModule":+true};</script>
<script+type="text/javascript"+src="/main.js">|code-block|syntax|javascript|2644913|确保检查您的main.js文件路径。|2644914|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

To solve this issue, put these two lines in your index.html page.
<pre><code>&lt;script&gt;var exports = {&quot;__esModule&quot;: true};&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot; src=&quot;/main.js&quot;&gt;
</code></pre>
Make sure to check your main.js file path.

blocks|key|2856177|text|试试上面@iFreilicht的建议。如果在安装了webpack和所有软件之后，这仍然不起作用，那么您可能只是从联机的某个地方复制了一个webpack配置，并在那里配置了您希望输出错误地支持CommonJS。确保这不是webpack.config.js中的情况|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2856178|module.exports+=+{
++mode:+process.env.NODE_ENV+%7C%7C+"development",
++entry:+{+
++++index:+"./src/js/index.ts"
++},
++...
++...
++output:+{
++++libraryTarget:+'commonjs',+++++++++<====+DELETE+THIS+LINE
++++path:+path.join(__dirname,+'build'),
++++filename:+"[name].bundle.js"
++}
};|code-block|syntax|javascript|2856179|entityMap^0|31|H|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|P|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Q|8|@]|D|@]|E|$]]]|L|$]]

Try what @iFreilicht suggested above. If that didn't work after you've installed webpack and all, you may have just copied a webpack configuration from somewhere online and configured there that you want the output to support CommonJS by mistake. Make sure this isn't the case in <code>webpack.config.js</code>:

<pre><code>module.exports = {
 mode: process.env.NODE_ENV || "development",
 entry: { 
 index: "./src/js/index.ts"
 },
 ...
 ...
 output: {
 libraryTarget: 'commonjs', &lt;==== DELETE THIS LINE
 path: path.join(__dirname, 'build'),
 filename: "[name].bundle.js"
 }
};
</code></pre>

blocks|key|2644831|text|有相同的问题，并通过更改JS包的加载顺序修复了该问题。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2644832|检查调用所需包的顺序，并以适当的顺序加载它们。|2644833|在我的特定情况下(不使用模块捆绑器)，我需要加载Redux，然后是Redux+Thunk，然后是React+Redux。在Redux+Thunk之前加载React+Redux会得到exports+is+not+defined。|offset|length|style|CODE|2644834|entityMap^0|0|0|O|5|X|B|1C|B|1P|B|24|B|2I|M|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|M|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|N|8|@$F|O|G|P|H|I]|$F|Q|G|R|H|I]|$F|S|G|T|H|I]|$F|U|G|V|H|I]|$F|W|G|X|H|I]|$F|Y|G|Z|H|I]]|9|@]|A|$]]|$1|J|3|-4|5|6|7|10|8|@]|9|@]|A|$]]]|K|$]]

Had the same issue and fixed it by changing the JS packages loading order.

Check the order in which the packages you need are being called and load them in an appropriate order.

In my specific case (not using module bundler) I needed to load <code>Redux</code>, then <code>Redux Thunk</code>, then <code>React Redux</code>. Loading <code>React Redux</code> before <code>Redux Thunk</code> would give me <code>exports is not defined</code>.

blocks|key|2856344|text|我也有同样的问题，但我的设置需要不同的解决方案。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2856345|我正在使用带有config-overrides.js文件的create-react-app-rewired包。以前，我从customize-cra使用addBabelPresets导入(在override()方法中)，并决定将这些预设抽象到一个单独的文件中。巧合的是，这解决了我的问题。|offset|length|style|CODE|2856346|我在config-overrides.js的override()方法中添加了useBabelRc()，并创建了一个包含以下内容的babel.config.js文件：|2856347|module.exports+=+{
++++presets:+[
++++++++'@babel/preset-react',
++++++++'@babel/preset-env'
++++],
}|code-block|syntax|javascript|2856348|entityMap^0|0|7|J|T|O|1O|D|23|F|2M|A|0|2|J|M|A|12|C|1S|F|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|R|8|@$D|S|E|T|F|G]|$D|U|E|V|F|G]|$D|W|E|X|F|G]|$D|Y|E|Z|F|G]|$D|10|E|11|F|G]]|9|@]|A|$]]|$1|H|3|I|5|6|7|12|8|@$D|13|E|14|F|G]|$D|15|E|16|F|G]|$D|17|E|18|F|G]|$D|19|E|1A|F|G]]|9|@]|A|$]]|$1|J|3|K|5|L|7|1B|8|@]|9|@]|A|$M|N]]|$1|O|3|-4|5|6|7|1C|8|@]|9|@]|A|$]]]|P|$]]

I had the same issue, but my setup required a different solution.
I'm using the <code>create-react-app-rewired</code> package with a <code>config-overrides.js</code> file. Previously, I was using the <code>addBabelPresets</code> import (in the <code>override()</code> method) from <code>customize-cra</code> and decided to abstract those presets to a separate file. Coincidentally, this solved my problem.
I added <code>useBabelRc()</code> to the <code>override()</code> method in <code>config-overrides.js</code> and created a <code>babel.config.js</code> file with the following:
<pre><code>module.exports = {
 presets: [
 '@babel/preset-react',
 '@babel/preset-env'
 ],
}
</code></pre>

blocks|key|2856401|text|我在SSR客户端部分使用了这样的错误，因为它使用了一个用tsconfig.json+compilerOptions构建的库作为target:+ES5，它带来了使用CommonJS进行模块解析的tsc+CLI+Options+Compiler+Options：target+===+"ES3"+or+"ES5"+?+"CommonJS"+:+"ES6"。当它使用目标ESNext时。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|2856402|entityMap|0|LINK|mutability|MUTABLE|url|https://www.typescriptlang.org/docs/handbook/compiler-options.html#compiler-options^0|2|3|S|D|16|F|1R|B|29|8|3L|1A|52|6|2O|W|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@$9|O|A|P|B|C]|$9|Q|A|R|B|C]|$9|S|A|T|B|C]|$9|U|A|V|B|C]|$9|W|A|X|B|C]|$9|Y|A|Z|B|C]|$9|10|A|11|B|C]]|D|@$9|12|A|13|1|14]]|E|$]]|$1|F|3|-4|5|6|7|15|8|@]|D|@]|E|$]]]|G|$H|$5|I|J|K|E|$L|M]]]]

I stuck with such error in a <code>SSR</code> client part because it used a lib which was built with <code>tsconfig.json</code> <code>compilerOptions</code> as <code>target: ES5</code> what brought using <code>CommonJS</code> for module resolution <a href="https://www.typescriptlang.org/docs/handbook/compiler-options.html#compiler-options" rel="nofollow noreferrer">tsc CLI Options Compiler Options</a>: <code>target === &quot;ES3&quot; or &quot;ES5&quot; ? &quot;CommonJS&quot; : &quot;ES6&quot;</code>. While it used the target <code>ESNext</code>.

blocks|key|2644988|text|由于ES5/ES2009不支持client+/+browser上的模块(导入/导出/要求)，因此您必须使用库，这些库将模块捆绑到单个文件中，该文件可以通过<script>标记包含，例如|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|BOLD|entityRanges|data|2644989|2644990|Browserify|unordered-list-item|2644991|Webpack|2644992|2644993|另请参见this+answer。|2644994|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/browserify/browserify|1|https://webpack.js.org/guides/getting-started/|2|https://stackoverflow.com/a/19059825/5164462^0|2|3|6|6|25|8|F|6|O|7|0|0|0|A|0|0|0|7|1|0|0|4|B|2|0^^$0|@$1|2|3|4|5|6|7|11|8|@$9|12|A|13|B|C]|$9|14|A|15|B|C]|$9|16|A|17|B|C]|$9|18|A|19|B|D]|$9|1A|A|1B|B|D]]|E|@]|F|$]]|$1|G|3|-4|5|6|7|1C|8|@]|E|@]|F|$]]|$1|H|3|I|5|J|7|1D|8|@]|E|@$9|1E|A|1F|1|1G]]|F|$]]|$1|K|3|L|5|J|7|1H|8|@]|E|@$9|1I|A|1J|1|1K]]|F|$]]|$1|M|3|-4|5|6|7|1L|8|@]|E|@]|F|$]]|$1|N|3|O|5|6|7|1M|8|@]|E|@$9|1N|A|1O|1|1P]]|F|$]]|$1|P|3|-4|5|6|7|1Q|8|@]|E|@]|F|$]]]|Q|$R|$5|S|T|U|F|$V|W]]|X|$5|S|T|U|F|$V|Y]]|Z|$5|S|T|U|F|$V|10]]]]

As <code>ES5</code>/<code>ES2009</code> doesn't support modules (import/export/require) on the client / browser you have to use libraries, which bundle the modules into a single file, which can be included via <code>&lt;script&gt;</code> tag, such as
<ul>
<li><a href="https://github.com/browserify/browserify" rel="nofollow noreferrer">Browserify</a></li>
<li><a href="https://webpack.js.org/guides/getting-started/" rel="nofollow noreferrer">Webpack</a></li>
</ul>
See also <a href="https://stackoverflow.com/a/19059825/5164462">this answer</a>.

blocks|key|105095|text|++{
++++"compileOnSave":+false,
++++"compilerOptions":+{
++++++"baseUrl":+"./",
++++++"outDir":+"./dist",
++++++"sourceMap":+true,
++++++"declaration":+false,
++++++"module":+"esnext",
++++++"moduleResolution":+"node",
++++++"emitDecoratorMetadata":+true,
++++++"experimentalDecorators":+true,
++++++"target":+"es5",
++++++"typeRoots":+["node_modules/@types"],
++++++"lib":+["es2018",+"dom"]
++++}
++}|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|105096|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code> {
 "compileOnSave": false,
 "compilerOptions": {
 "baseUrl": "./",
 "outDir": "./dist",
 "sourceMap": true,
 "declaration": false,
 "module": "esnext",
 "moduleResolution": "node",
 "emitDecoratorMetadata": true,
 "experimentalDecorators": true,
 "target": "es5",
 "typeRoots": ["node_modules/@types"],
 "lib": ["es2018", "dom"]
 }
 }
</code></pre>

blocks|key|107249|text|如果您只是使用类型的接口，则省略export关键字，ts可以在不需要导入的情况下获取类型。关键是你不能在任何地方使用import/export。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|107250|export+interface+Person+{
+++name:+string;
+++age:+number;
}|code-block|syntax|javascript|107251|转到|107252|interface+Person+{
+++name:+string;
+++age:+number;
}|107253|entityMap^0|G|6|1M|6|1T|6|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@$9|R|A|S|B|C]|$9|T|A|U|B|C]|$9|V|A|W|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|X|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|Y|8|@]|D|@]|E|$]]|$1|M|3|N|5|H|7|Z|8|@]|D|@]|E|$I|J]]|$1|O|3|-4|5|6|7|10|8|@]|D|@]|E|$]]]|P|$]]

If you are just using interfaces for types, leave out the <code>export</code> keyword and ts can pick up on the types without needing to import. They key is you cannot use <code>import</code>/<code>export</code> anywhere.
<pre><code>export interface Person {
 name: string;
 age: number;
}
</code></pre>
into
<pre><code>interface Person {
 name: string;
 age: number;
}
</code></pre>

Trying to implement a module following the <a href="https://www.typescriptlang.org/docs/handbook/modules.html" rel="noreferrer">official handbook</a>, I get this error message:

<blockquote>
 Uncaught ReferenceError: exports is not defined
 
 at app.js:2
</blockquote>

But nowhere in my code do I ever use the name <code>exports</code>.

How can I fix this?

<hr>

<h1>Files</h1>

<h3>app.ts</h3>

<pre><code>let a = 2;
let b:number = 3;

import Person = require ('./mods/module-1');
</code></pre>

<h3>module-1.t</h3>

<pre><code> export class Person {
 constructor(){
 console.log('Person Class');
 }
}
export default Person;
</code></pre>

<h3>tsconfig.json</h3>

<pre><code>{
 "compilerOptions": {
 "module": "commonjs",
 "target": "es5",
 "noImplicitAny": false,
 "sourceMap": true,
 "outDir": "scripts/"
 },
 "exclude": [
 "node_modules"
 ]
}
</code></pre>

Typescript ReferenceError: exports is not defined

TypeScript

编译器

尝试实现遵循的模块时，我收到以下错误消息：未捕获ReferenceError:未定义导出在app.js:2但是在我的代码中，我从来没有使用过exports这个名字。我该如何解决这个问题呢？文件app.tslet a = 2;let b:number = 3;import Person = require ('./mods/module-1');module-1.t export class Per

问Typescript ReferenceError:未定义导出
EN

回答 24

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Typescript ReferenceError:未定义导出EN

回答 24

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Typescript ReferenceError:未定义导出
EN