I'm trying to bundle Angular2 modules using Rollup.js. this is my rollup.config.vendor.js file:
import typescript from 'rollup-plugin-typescript2';
import resolve from 'rollup-plugin-node-resolve';
import commonjs from 'rollup-plugin-commonjs';
export default {
entry: 'vendor.ts',
dest: './Bundle/vendor.js',
format: 'iife',
moduleName: 'vendor',
plugins: [
typescript(),
resolve({
jsnext: true,
main: true,
browser: true
}),
commonjs({
include: 'node_modules/rxjs/**',
}),
]
}
It creates a bundled js, but in the process it keeps printing this kind of message:
The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
https://github.com/rollup/rollup/wiki/Troubleshooting#this-is-undefined
node_modules\@angular\forms\@angular\forms.es5.js (1:25)
1: var __extends = (this && this.__extends) || function (d, b) {
^
2: for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
3: function __() { this.constructor = d; }
What does it mean?
Am I doing something wrong or is it the way it's supposed to be?
You could safely ignore those warnings as explained in the documentation
by adding the onwarn
property to your rollup-config.js
file:
onwarn: function(warning) {
// Skip certain warnings
// should intercept ... but doesn't in some rollup versions
if ( warning.code === 'THIS_IS_UNDEFINED' ) { return; }
// console.warn everything else
console.warn( warning.message );
}
Quote:
It overrides the default onwarn method in order to skip annoying messages about the AOT compiler's use of the this keyword.
You could use the context
option and set it to this
: it avoids the rewrite of this
to undefined
(in fact this
is rewritten to... this
).
See Rollup documentation:
The reason this is happening is that typescript
will attempt to shim out await
if the language target is too low, and typescript
's await shim leans on global this. The warning is triggered by the use of global this, which it can't prove was safely stubbed out (but was.)
Whereas you can cause the error message to be omitted, since you're bundling, the better choice is to use a language target that presumes await.
In your tsconfig.json
, set target
to es2017
or higher, and this will go away.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With