"OuterSubscriber is not defined" 与 rollup.js 捆绑时
"OuterSubscriber is not defined" when bundeling with rollup.js
更新到 Angular2 RC7 后,我在浏览器中 运行ning 时收到以下 JavaScript 错误:
OuterSubscriber is not defined
这仅在我使用 rollup.js
创建捆绑包时发生。如果我 运行 没有捆绑 JavaScript 的应用程序,它可以正常工作。
错误一定与 rxjs
有关,因为 OuterSubscriber
是错误的一部分。我检查了捆绑包,但在那里找不到 OuterSubscriber
。我想 rollup.js
认为没有必要,因此不包含它。
环境:
angular, v2.0.0-rc.7
rxjs, v5.0.0-beta.12
systemjs, v0.19.27
gulp-rollup, v2.4.0
rollup-stream, v1.13.0
在 system.js
配置中,我将 umd
模块(例如 core.umd.js
)映射到 angular
。对于 rxjs
,我使用经典映射,如 example.
有谁知道我做错了什么吗?
目前 rollup
似乎有两个问题。
rollup
不会规范化路径中的斜杠('/'
与 '\'
)和 issue is still open。要修复它 rollup.config.js
需要添加以下内容:
resolveId(id, from){
if (id.startsWith('rxjs/') || id.startsWith('rxjs\')){
let result = `${__dirname}/node_modules/rxjs-es/${id.replace('rxjs/', '')}.js`;
return result.replace(/\//g, "\"); // Add this
}
}
- 它破坏了 ES2015 代码,但 ES5 工作正常,因此它需要使用 ES2015 模块将
rxjs-es
编译为 ES5,并让汇总解析器改用它。这是一个单独的 tsconfig.rx.json
:
{
"compilerOptions": {
"target": "ES5",
"module": "ES2015",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": true,
"noImplicitAny": false,
"skipLibCheck": true,
"outDir": "temp/rxjs",
"allowJs": true
},
"include": [
"node_modules/rxjs-es/**/*.js"
],
"exclude": [
"wwwroot",
"node_modules/rxjs-es/rx.js"
]
}
和rollup.config.js
:
resolveId(id, from){
if (id.startsWith('rxjs/') || id.startsWith('rxjs\')){
let result = `${__dirname}/temp/rxjs/${id.replace('rxjs/', '')}.js`;
//let result = `${__dirname}/node_modules/rxjs-es/${id.replace('rxjs/', '')}.js`;
return result.replace(/\//g, "\");
}
}
Rollup 0.34.0 适用于 2.0.0-rc.7,经过验证的 Rollup 0.34.0 也适用于 2.0.0,但我能够使用 0.35.0 重现该问题
更新到 Angular2 RC7 后,我在浏览器中 运行ning 时收到以下 JavaScript 错误:
OuterSubscriber is not defined
这仅在我使用 rollup.js
创建捆绑包时发生。如果我 运行 没有捆绑 JavaScript 的应用程序,它可以正常工作。
错误一定与 rxjs
有关,因为 OuterSubscriber
是错误的一部分。我检查了捆绑包,但在那里找不到 OuterSubscriber
。我想 rollup.js
认为没有必要,因此不包含它。
环境:
angular, v2.0.0-rc.7
rxjs, v5.0.0-beta.12
systemjs, v0.19.27
gulp-rollup, v2.4.0
rollup-stream, v1.13.0
在 system.js
配置中,我将 umd
模块(例如 core.umd.js
)映射到 angular
。对于 rxjs
,我使用经典映射,如 example.
有谁知道我做错了什么吗?
目前 rollup
似乎有两个问题。
rollup
不会规范化路径中的斜杠('/'
与'\'
)和 issue is still open。要修复它rollup.config.js
需要添加以下内容:
resolveId(id, from){
if (id.startsWith('rxjs/') || id.startsWith('rxjs\')){
let result = `${__dirname}/node_modules/rxjs-es/${id.replace('rxjs/', '')}.js`;
return result.replace(/\//g, "\"); // Add this
}
}
- 它破坏了 ES2015 代码,但 ES5 工作正常,因此它需要使用 ES2015 模块将
rxjs-es
编译为 ES5,并让汇总解析器改用它。这是一个单独的tsconfig.rx.json
:
{
"compilerOptions": {
"target": "ES5",
"module": "ES2015",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": true,
"noImplicitAny": false,
"skipLibCheck": true,
"outDir": "temp/rxjs",
"allowJs": true
},
"include": [
"node_modules/rxjs-es/**/*.js"
],
"exclude": [
"wwwroot",
"node_modules/rxjs-es/rx.js"
]
}
和rollup.config.js
:
resolveId(id, from){
if (id.startsWith('rxjs/') || id.startsWith('rxjs\')){
let result = `${__dirname}/temp/rxjs/${id.replace('rxjs/', '')}.js`;
//let result = `${__dirname}/node_modules/rxjs-es/${id.replace('rxjs/', '')}.js`;
return result.replace(/\//g, "\");
}
}
Rollup 0.34.0 适用于 2.0.0-rc.7,经过验证的 Rollup 0.34.0 也适用于 2.0.0,但我能够使用 0.35.0 重现该问题