From 98e4adb3226bdd70a629050d0e4bd674578c462b Mon Sep 17 00:00:00 2001 From: Alexander Early Date: Tue, 19 Jan 2016 23:37:18 -0800 Subject: [PATCH 1/2] use an interopRequire function for external CJS deps with a default export --- src/finalisers/cjs.js | 19 +++++++++++++------ .../_expected/cjs.js | 5 +++-- test/form/external-imports/_expected/cjs.js | 11 ++++++----- 3 files changed, 22 insertions(+), 13 deletions(-) diff --git a/src/finalisers/cjs.js b/src/finalisers/cjs.js index 3a56ac9..4651409 100644 --- a/src/finalisers/cjs.js +++ b/src/finalisers/cjs.js @@ -3,17 +3,24 @@ import getExportBlock from './shared/getExportBlock.js'; export default function cjs ( bundle, magicString, { exportMode }, options ) { let intro = options.useStrict === false ? `` : `'use strict';\n\n`; + const hasDefaultImport = bundle.externalModules.some( mod => mod.declarations.default); + + if (hasDefaultImport) { + intro += `function _interopRequire (id) { var ex = require(id); return 'default' in ex ? ex['default'] : ex; }\n\n`; + } + // TODO handle empty imports, once they're supported const importBlock = bundle.externalModules .map( module => { - let requireStatement = `var ${module.name} = require('${module.id}');`; - if ( module.declarations.default ) { - requireStatement += '\n' + ( module.exportsNames ? `var ${module.name}__default = ` : `${module.name} = ` ) + - `'default' in ${module.name} ? ${module.name}['default'] : ${module.name};`; + let importStatement = `var ${module.name} = _interopRequire('${module.id}');`; + if (module.exportsNames) { + importStatement += `\nvar ${module.name}__default = ${module.name};`; + } + return importStatement; + } else { + return `var ${module.name} = require('${module.id}');`; } - - return requireStatement; }) .join( '\n' ); diff --git a/test/form/external-imports-custom-names/_expected/cjs.js b/test/form/external-imports-custom-names/_expected/cjs.js index e83d17d..7c31c60 100644 --- a/test/form/external-imports-custom-names/_expected/cjs.js +++ b/test/form/external-imports-custom-names/_expected/cjs.js @@ -1,7 +1,8 @@ 'use strict'; -var $ = require('jquery'); -$ = 'default' in $ ? $['default'] : $; +function _interopRequire (id) { var ex = require(id); return 'default' in ex ? ex['default'] : ex; } + +var $ = _interopRequire('jquery'); $( function () { $( 'body' ).html( '

hello world!

' ); diff --git a/test/form/external-imports/_expected/cjs.js b/test/form/external-imports/_expected/cjs.js index 6c20bcc..6cfae7f 100644 --- a/test/form/external-imports/_expected/cjs.js +++ b/test/form/external-imports/_expected/cjs.js @@ -1,14 +1,15 @@ 'use strict'; -var factory = require('factory'); -factory = 'default' in factory ? factory['default'] : factory; +function _interopRequire (id) { var ex = require(id); return 'default' in ex ? ex['default'] : ex; } + +var factory = _interopRequire('factory'); var baz = require('baz'); var containers = require('shipping-port'); -var alphabet = require('alphabet'); -var alphabet__default = 'default' in alphabet ? alphabet['default'] : alphabet; +var alphabet = _interopRequire('alphabet'); +var alphabet__default = alphabet; factory( null ); baz.foo( baz.bar, containers.port ); containers.forEach( console.log, console ); console.log( alphabet.a ); -console.log( alphabet__default.length ); +console.log( alphabet__default.length ); \ No newline at end of file From 1f3488dcfdb059a53fa24aaef827bbdcae19ab6e Mon Sep 17 00:00:00 2001 From: Alexander Early Date: Wed, 20 Jan 2016 14:59:48 -0800 Subject: [PATCH 2/2] add _interopDefault to globals, fix behavior or module__default, make cjs work with browserify --- src/Bundle.js | 2 +- src/finalisers/cjs.js | 9 +++++---- test/form/external-imports-custom-names/_expected/cjs.js | 6 +++--- test/form/external-imports/_expected/cjs.js | 8 ++++---- 4 files changed, 13 insertions(+), 12 deletions(-) diff --git a/src/Bundle.js b/src/Bundle.js index accd9ae..c6a2386 100644 --- a/src/Bundle.js +++ b/src/Bundle.js @@ -63,7 +63,7 @@ export default class Bundle { this.onwarn = options.onwarn || makeOnwarn(); // TODO strictly speaking, this only applies with non-ES6, non-default-only bundles - [ 'module', 'exports' ].forEach( global => this.assumedGlobals[ global ] = true ); + [ 'module', 'exports', '_interopDefault' ].forEach( global => this.assumedGlobals[ global ] = true ); } build () { diff --git a/src/finalisers/cjs.js b/src/finalisers/cjs.js index 4651409..c71f59d 100644 --- a/src/finalisers/cjs.js +++ b/src/finalisers/cjs.js @@ -6,18 +6,19 @@ export default function cjs ( bundle, magicString, { exportMode }, options ) { const hasDefaultImport = bundle.externalModules.some( mod => mod.declarations.default); if (hasDefaultImport) { - intro += `function _interopRequire (id) { var ex = require(id); return 'default' in ex ? ex['default'] : ex; }\n\n`; + intro += `function _interopDefault (ex) { return 'default' in ex ? ex['default'] : ex; }\n\n`; } // TODO handle empty imports, once they're supported const importBlock = bundle.externalModules .map( module => { if ( module.declarations.default ) { - let importStatement = `var ${module.name} = _interopRequire('${module.id}');`; if (module.exportsNames) { - importStatement += `\nvar ${module.name}__default = ${module.name};`; + return `var ${module.name} = require('${module.id}');` + + `\nvar ${module.name}__default = _interopDefault(${module.name});`; + } else { + return `var ${module.name} = _interopDefault(require('${module.id}'));`; } - return importStatement; } else { return `var ${module.name} = require('${module.id}');`; } diff --git a/test/form/external-imports-custom-names/_expected/cjs.js b/test/form/external-imports-custom-names/_expected/cjs.js index 7c31c60..8f6506e 100644 --- a/test/form/external-imports-custom-names/_expected/cjs.js +++ b/test/form/external-imports-custom-names/_expected/cjs.js @@ -1,9 +1,9 @@ 'use strict'; -function _interopRequire (id) { var ex = require(id); return 'default' in ex ? ex['default'] : ex; } +function _interopDefault (ex) { return 'default' in ex ? ex['default'] : ex; } -var $ = _interopRequire('jquery'); +var $ = _interopDefault(require('jquery')); $( function () { $( 'body' ).html( '

hello world!

' ); -}); +}); \ No newline at end of file diff --git a/test/form/external-imports/_expected/cjs.js b/test/form/external-imports/_expected/cjs.js index 6cfae7f..a3ee9b0 100644 --- a/test/form/external-imports/_expected/cjs.js +++ b/test/form/external-imports/_expected/cjs.js @@ -1,12 +1,12 @@ 'use strict'; -function _interopRequire (id) { var ex = require(id); return 'default' in ex ? ex['default'] : ex; } +function _interopDefault (ex) { return 'default' in ex ? ex['default'] : ex; } -var factory = _interopRequire('factory'); +var factory = _interopDefault(require('factory')); var baz = require('baz'); var containers = require('shipping-port'); -var alphabet = _interopRequire('alphabet'); -var alphabet__default = alphabet; +var alphabet = require('alphabet'); +var alphabet__default = _interopDefault(alphabet); factory( null ); baz.foo( baz.bar, containers.port );