finom / babel-plugin-transform-es2015-modules-simple-amd Goto Github PK

i am trying to use the plugin but get this error

error [ERR_MODULE_NOT_FOUND]: Cannot find package 'babel-preset-transform-es2015-modules-simple-amd' imported from /Users/admin/Repositories/fe-js-tests/durandaljs/babel-virtual-resolve-base.js

It would be really cool if this could support non-default exports / destructuring-style imports, e.g.

foo.js

export function a(){...};
export function b(){...};

bar.js

import {a, b} from foo;

or at least support it with a syntax like

foo.js

export default {a: function(){...}, b: function(){...}};

I imagine this would come with the restriction that no module compiled with this plugin could have both an export default and named exports - even though that's technically allowed by the ES6 spec.

Why I want this: I work on a fairly sizeable coffeescript / AMD codebase, and we are looking to migrate to ES6. We were going to use babel-plugin-transform-es2015-modules-amd, but the problem we found with it is that our coffeescript modules do not understand it's version of default exports - they are not going to .default anything without modification, which makes incremental upgrading hard for some of our modules. I was very happy to see this plugin which does default exports the way I wanted, but we also have a penchant for using destructuring on coffeescript imports and I would like to be able to use import {...} from foo as an alternative to that; the few ES6 modules we've written so far already make use of this syntax.

This plugin was a lifesaver for being able to use the import/export syntax with an AMD loader. However, Dojo had decided to use a special function to create 'classes' called declare. It seems rather easy, if not tedius, to convert ClassDefinitions and ClassExtensions into dojo compatible calls.

Possible Solution:

{
    "plugins": [
        [
            "transform-es2015-modules-simple-amd",
            {
                "classes": true,
                "target": "dojo"
            }
        ]
    ]
}

Input.js

import _WidgetBase from "dijit/_WidgetBase"

export default class extends _WidgetBase {
    constructor() {
        super();
    }
}

Input-compiled.js

"use strict";
define(["dojo/_base/declare", "dijit/_WidgetBase"], function (declare, _WidgetBase) {
    return declare([_WidgetBase], {
        constructor: function (args) {
            this.inherited(args);
        }
    });
});
//# sourceMappingURL=dojo-test.js.map

import Default, {Other} from 'module'

causes TypeError: Cannot read property 'name' of undefined
at babel-plugin-transform-es2015-modules-simple-amd/dist/index.js:63:151

using version 0.3.0

import {default as Default, Other} from 'module'

works

I am trying to compile a file with the following content:

export default class Foo {}

The output of the compilation is:

"use strict";

define(["@babel/runtime/helpers/classCallCheck"], function (_classCallCheck) {
  var Foo = function Foo() {
    _classCallCheck(this, Foo);
  };

  export { Foo as default };
});

My babel configuration is:

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "useBuiltIns": "usage",
        "debug": false,
        "corejs": 3,
        "targets": {
          "ie": "11",
          "edge": "40",
          "safari": "10",
          "firefox": "58",
          "chrome": "64"
        }
      }
    ]
  ],
  "plugins": [
    "@babel/plugin-transform-runtime",
    "babel-plugin-transform-es2015-modules-simple-amd"
  ],
  "sourceType": "module",
  "minified": false
}

And the versions of all of these, as declared in package.json are:

    "@babel/cli": "^7.6.0",
    "@babel/core": "^7.6.0",
    "@babel/plugin-transform-runtime": "^7.6.2",
    "@babel/preset-env": "^7.6.0",
    "babel-plugin-transform-es2015-modules-simple-amd": "^0.3.0",
    "core-js": "^3.2.1",

Do you know what might be causing this?

I get this error after npm installing and using this plugin (via grunt-babel) in my project:

Warning: Cannot find module 'babel-template' Use --force to continue.

After running npm install --save-dev babel-template the plugin worked (very clean output by the way). Should babel-template be a dependency instead of a devDependency of this module?

Say, we have a source:

export function func1() {}

export function func2() {}

export default { func1, func2 };

Convert the source using the plugin.

Actual results contain export keyword:

"use strict";

define([], function () {
  export function func1() {}

  export function func2() {}

  return { func1: func1, func2: func2 };
});

Expected results:

"use strict";

define([], function () {
  function func1() {}

  function func2() {}

  return { func1: func1, func2: func2 };
});