I'm using angularjs and typescript to create some app, I'm having a trouble with this error that I can't solve
我正在使用angularjs和typescript来创建一些应用程序,我遇到了这个我无法解决的错误
Here is my *.ts code
这是我的* .ts代码
export var NgApp = new application.Startup();
///<reference path="../../../../../typings/tsd.d.ts"/>
import {NgApp} from "../../bootstrap";
module views.components.home {
export class HomeComponent {
public constructor() {
}
public static factory():Function[] {
return [
() => new HomeComponent()
]
}
}
}
NgApp.registerComponents(views.components.home,() => this.app.controller);
Here is my GULP task
这是我的GULP任务
let tsResult = gulp.src('src/**/*.ts').pipe(ts({
module: 'commonjs',
sourceMap: true
}));
let taskTs = tsResult.js.pipe(gulp.dest('built/'));
This is my error: Uncaught ReferenceError: exports is not defined
这是我的错误:未捕获的ReferenceError:未定义导出
The question is: How can I use import like es6 in typescript? What I am missing?
问题是:如何在打字稿中使用像es6这样的导入?我错过了什么?
3 个解决方案
#1
11
I use angular 1.6 and webpack, it works on my side when i changed the module to "umd"
我使用angular 1.6和webpack,当我将模块更改为“umd”时,它在我身边工作
UMD: Universal Module Definition This has brought about the push for a “universal” pattern that supports both styles (AMD and CommonJS)
UMD:通用模块定义这带来了支持两种风格(AMD和CommonJS)的“通用”模式的推动
reference: http://davidbcalhoun.com/2014/what-is-amd-commonjs-and-umd/
参考:http://davidbcalhoun.com/2014/what-is-amd-commonjs-and-umd/
pasted here is my tsconfig.json after I changed it, I run $ tsc
粘贴在这里是我更改后的tsconfig.json,我运行$ tsc
{
"compilerOptions": {
"target": "es5",
"module": "umd",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": [ "es2015", "dom" ],
"noImplicitAny": true,
"removeComments": true,
"preserveConstEnums": true,
"allowUnreachableCode": true
},
"exclude": [
"node_modules"
]
}
then my "exports is not defined" error is gone.
然后我的“导出未定义”错误消失了。
#2
2
click here "Solved finally" i was also getting same error i changed module:"commonjs" to "module": "es6", because targeting ES5 remove the import/export statements, so these tools cannot remove unused exports.
点击这里“最后解决”我也得到了相同的错误我改变了模块:“commonjs”到“模块”:“es6”,因为针对ES5删除了导入/导出语句,所以这些工具无法删除未使用的导出。
{
"compilerOptions": {
"target": "es5",
"module": "es6",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": [ "es2015", "dom" ],
"noImplicitAny": true,
"suppressImplicitAnyIndexErrors": true
}
}
#3
0
How can I use import like es6 in typescript? What I am missing?
如何在打字稿中使用像es6这样的导入?我错过了什么?
You need to use a module loader. Here is a sample that uses webpack : https://github.com/AngularClass/angular2-webpack-starter
您需要使用模块加载器。以下是使用webpack的示例:https://github.com/AngularClass/angular2-webpack-starter
#1
11
I use angular 1.6 and webpack, it works on my side when i changed the module to "umd"
我使用angular 1.6和webpack,当我将模块更改为“umd”时,它在我身边工作
UMD: Universal Module Definition This has brought about the push for a “universal” pattern that supports both styles (AMD and CommonJS)
UMD:通用模块定义这带来了支持两种风格(AMD和CommonJS)的“通用”模式的推动
reference: http://davidbcalhoun.com/2014/what-is-amd-commonjs-and-umd/
参考:http://davidbcalhoun.com/2014/what-is-amd-commonjs-and-umd/
pasted here is my tsconfig.json after I changed it, I run $ tsc
粘贴在这里是我更改后的tsconfig.json,我运行$ tsc
{
"compilerOptions": {
"target": "es5",
"module": "umd",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": [ "es2015", "dom" ],
"noImplicitAny": true,
"removeComments": true,
"preserveConstEnums": true,
"allowUnreachableCode": true
},
"exclude": [
"node_modules"
]
}
then my "exports is not defined" error is gone.
然后我的“导出未定义”错误消失了。
#2
2
click here "Solved finally" i was also getting same error i changed module:"commonjs" to "module": "es6", because targeting ES5 remove the import/export statements, so these tools cannot remove unused exports.
点击这里“最后解决”我也得到了相同的错误我改变了模块:“commonjs”到“模块”:“es6”,因为针对ES5删除了导入/导出语句,所以这些工具无法删除未使用的导出。
{
"compilerOptions": {
"target": "es5",
"module": "es6",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": [ "es2015", "dom" ],
"noImplicitAny": true,
"suppressImplicitAnyIndexErrors": true
}
}
#3
0
How can I use import like es6 in typescript? What I am missing?
如何在打字稿中使用像es6这样的导入?我错过了什么?
You need to use a module loader. Here is a sample that uses webpack : https://github.com/AngularClass/angular2-webpack-starter
您需要使用模块加载器。以下是使用webpack的示例:https://github.com/AngularClass/angular2-webpack-starter