systemjs / plugin-babel

SystemJS Babel Plugin
MIT License
82 stars 33 forks source link

still unclear how to use this plugin #24

Closed PinkaminaDianePie closed 8 years ago

PinkaminaDianePie commented 8 years ago

When i include this plugin in my project there still errors with searching of babel files: ENOENT: no such file or directory, open '/home/pinkiepie/projects/planck/test/mocks/babel-plugin-transform-es2015-template-literals.js Should i manual add all of plugins in System.config map section?

guybedford commented 8 years ago

Nothing should be loading that as a dependency. Is this with bundling, or just via System.import?

PinkaminaDianePie commented 8 years ago

System.import / node.js / plugin installed with npm install (i dont need jspm)

guybedford commented 8 years ago

Perhaps you can explain exactly what you're doing to get this error. Following the README here, the simplest test case in Node would be: test.js

var SystemJS = require('systemjs');

SystemJS.config({
  map: {
    'plugin-babel': 'node_modules/systemjs-plugin-babel/plugin-babel.js',
    'systemjs-babel-build': 'node_modules/systemjs-plugin-babel/systemjs-babel-node.js'
  },
  transpiler: 'plugin-babel'
});

SystemJS.import('./es6.js').then(console.log.bind(console));

Which definitely runs fine via node test.js.

PinkaminaDianePie commented 8 years ago

my system.js file:

'use strict';

require('systemjs');

System.config({
    defaultJSExtensions: true,
    transpiler: 'plugin-babel',
    map: {
        json: '../../node_modules/systemjs-plugin-json/json.js',
        'plugin-babel': './node_modules/systemjs-plugin-babel/plugin-babel.js',
        'systemjs-babel-build': './systemjs-babel-node.js'
    },
    meta: {
        '*.json': {
            loader: 'json'
        }
    },
    babelOptions: {
        plugins: [
            'babel-plugin-transform-es2015-template-literals'
        ]
    }
});

in my test files (es5) i import system.js at first and after that i importing another es6 files with System.import()

guybedford commented 8 years ago

You don't need to include the line -

    babelOptions: {
        plugins: [
            'babel-plugin-transform-es2015-template-literals'
        ]
    }
PinkaminaDianePie commented 8 years ago

Why not? How then i will specify which of transformers should run?

guybedford commented 8 years ago

By default all ES6 transforms are run. See https://github.com/systemjs/plugin-babel#es-features for more info.

PinkaminaDianePie commented 8 years ago

How i can use SystemJS with Babel 6.x with specific list of transformers? Only with providing all paths to all babel files?

guybedford commented 8 years ago

The way to do this would be to custom install that plugin, and reference it in the configuration as its own path so SystemJS can find it. That will be a rabbit hole though without jspm as you'd need to link up all its dependencies in turn.

Perhaps you can explain why you'd want to disable the other transformers? It's not a case that was designed for.

PinkaminaDianePie commented 8 years ago

As i said, i use SystemJS for node, not for browsers, so i can turn off some of features, supported by node natively. It's very hard for Babel 5.x because of tight coupling in most of transformers. Babel 6.x uses new traversal algorythm, which can help with coupling, so i can turn off some transformers (such as classes and rest/spread) and speed up my app. But with plain SystemJS i can not use Babel 6.x at all, and with this plugin i can't specify transformers easy way, only way is to provide path to each transformer in map section in config.

guybedford commented 8 years ago

NodeJS supports template literals though, so perhaps you can just turn off all ES6 features with System.config({ babelOptions: { es2015: false } })?

PinkaminaDianePie commented 8 years ago

This config was just an my test to use SystemJS with this plugin, i need much more transformers, than only template literals. For now node supports about a half of es6 features, but because of babel's tight coupling i thing i still need to turn on about 60-70% of transformers. So i still need to include them all separately in map section of this config. Am i right? Just to be clear.

guybedford commented 8 years ago

My question is how are you deciding which transformers to include? Which baseline level of NodeJS support are you working to?

Template literals as far as I can tell are supported in NodeJS 4.0+, so that's why I was wondering exactly what compatibility case you're after if you needed that transform.

PinkaminaDianePie commented 8 years ago

Node 5.x for now. Template literals was just an example. I need as minimum default parameters and destructuring with Babel 6.x, but with Babel 5.x es7 does not work separately from es6 transformers (for example decorators works only if classes transformers turned on), so in Babel 5.x i was forced to use almost all. I dont really know how much transformers i will need to use in Babel 6.x, but according to http://kangax.github.io/compat-table/es6/ my minimum is default parameters and destructuring (plus all es7 transformers). Im asking not about template literals, im asking about case, when i need to turn on only part of transformers. In this case should i include them all separately in map section of SystemJS config? Or there are some easier ways?

guybedford commented 8 years ago

Sure point taken, the ability to select subsets of the presets would be useful, but currently we don't offer this ability apart from using your own plugin builds.

One way to do this is to browserify (or jspm build) up the destructuring and default paramters plugins as a custom preset and then load that preset build with SystemJS to set as a preset to use.

I'm wondering if it might be worth trying to just enable flags in NodeJS rather here with the --harmony_default_parameters until these are in the main branch.

PinkaminaDianePie commented 8 years ago

Thanks for explanation, i will try to add all transformers manually. About node flags - i dont like this solution, i had tried to enable rest/spread in node 4.x and some cases was broken, so i spended a lot of time trying to find bugs, because i thought it was error in my code, not in v8. So it will be better to setup this plugin, even if it will take more time.