Invalid property of 'default'

[folmert]

This is index.js of babel-plugin-dynamic-import-node which I downloaded from npm, also v.1.0.2

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _babelTemplate = require('babel-template');

var _babelTemplate2 = _interopRequireDefault(_babelTemplate);

var _babelPluginSyntaxDynamicImport = require('babel-plugin-syntax-dynamic-import');

var _babelPluginSyntaxDynamicImport2 = _interopRequireDefault(_babelPluginSyntaxDynamicImport);

var _babelTypes = require('babel-types');

var t = _interopRequireWildcard(_babelTypes);

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj['default'] = obj; return newObj; } }

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

var TYPE_IMPORT = 'Import';

var buildImport = (0, _babelTemplate2['default'])('\n  Promise.resolve().then(() => require(SOURCE))\n');

exports['default'] = function () {
  return {
    inherits: _babelPluginSyntaxDynamicImport2['default'],

    visitor: {
      CallExpression: function () {
        function CallExpression(path) {
          if (path.node.callee.type === TYPE_IMPORT) {
            var importArgument = path.node.arguments[0];
            var newImport = buildImport({
              SOURCE: t.isStringLiteral(importArgument) || t.isTemplateLiteral(importArgument) ? path.node.arguments : t.templateLiteral([t.templateElement({ raw: '', cooked: '' }), t.templateElement({ raw: '', cooked: '' }, true)], path.node.arguments)
            });
            path.replaceWith(newImport);
          }
        }

        return CallExpression;
      }()
    }
  };
};

Why is it completely different than index.js here, in this repo?

Btw. the one on GitHub doesn't seem to work (still returns unexpected token), the one on npm works, but only after you add module.exports = exports["default"] at the end of index.js, otherwise babel-jest returns Plugin 1 specified in "base" provided an invalid property of "default"

[ljharb]

Because there's a build process, like most JS packages these days - the index.js on github is the raw source (that probably won't work in most engines), and what you're looking at is the babel-compiled ES5 version.

If you're getting a babel-jest error, what's your .babelrc look like?

[folmert]

Aha, that makes sense :)

About the error, the thing is that when I load babel-plugin-dynamic-import node via .babelrc in root dir it works, but since I can't have .babelrc in root dir (folder structure not up to me), I'm using a workaround with a custom transformer:

// Custom Jest transform implementation that wraps babel-jest and injects our
// babel presets, so we don't have to use .babelrc.
module.exports = require('babel-jest').createTransformer({
    presets: [
        require("babel-preset-react"),
        require("babel-preset-es2015")
    ],
    plugins: [
        require("babel-plugin-syntax-dynamic-import"), // loads, but is useless
        require("babel-plugin-dynamic-import-node") // doesn't load (throws: Invalid property of 'default')
    ]
});

and this is where it fails.

I reported it as a bug to Jest, but they put it off by saying that it seems like an issue with dynamic import plugin. I don't know, but the more I dig in it, the more it seems like it actually is an issue of this plugin, because all other babel plugins load fine and don't return this error when using custom transformer.

[ljharb]

For now, you need to add a .default on to your require, due to the way Babel transpiles imports.

[ljharb]

It's certainly something this package should have fixed initially, but "not a root .babelrc" isn't a common use case, so we didn't anticipate it.

[menewman]

+1 - We ran into the default issue as well when trying to use dynamic imports + Jest + Meteor, but the following works:

module.exports = require('babel-jest').createTransformer({
  presets: ['flow', 'latest', 'react', 'stage-3'],
  plugins: [
    'babel-plugin-transform-runtime',
    'babel-plugin-transform-object-rest-spread',
    'syntax-dynamic-import',
    require('babel-plugin-dynamic-import-node').default // https://github.com/airbnb/babel-plugin-dynamic-import-node/issues/27
  ]
});

EDIT: As of the latest version of this package, this workaround seems to be unnecessary.