Unable to use it - Uncaught ReferenceError: require is not defined in plugin-babel.js

[Paweł]

Hi,

I'm trying to use this plugin in order to use Babel 6 with SystemJs (without jspm). Probably I'm doing something terribly wrong, because even though I follow docs, I cannot make it work. This is what I have in my index.html:

• reference to SystemJS v0.19.3

<script src="bower_components/system.js/dist/system.js"></script>

• script block that configures SystemJS:

<script>
  System.config({
    map: {
      'plugin-babel': '../node_modules/systemjs-plugin-babel/plugin-babel.js',
      'systemjs-babel-build': '../node_modules/systemjs-plugin-babel/systemjs-babel-browser.js'
    },
    transpiler: 'plugin-babel'
  });
  System.import('app.js');
</script>

Paths are OK. When I enter the page, /node_modules/systemjs-plugin-babel/plugin-babel.js is downloaded, but I crashes on first line (require is undefined):

var babel = require('systemjs-babel-build').babel;

Thanks for help.
Pawel

[Guy Bedford]

Thanks for posting, I just included a manual test to double-check this in https://github.com/systemjs/plugin-babel/blob/master/test/manual.html and it's definitely working fine for me. Perhaps you're using the CSP version of SystemJS or have custom meta configuration present that is conflicting with loading plugin-babel as CommonJS?

[Julien Sanchez]

I had the same problem. In the end, it stemmed from using babel as transpiler value instead of plugin-babel.

// Non working
System.config({
  map: {
    'babel': '../plugin-babel.js',
    'systemjs-babel-build': '../systemjs-babel-browser.js'
  },
  transpiler: 'babel'
});

// => system.src.js:122 Uncaught (in promise) Error: (SystemJS) require is not defined(…)

It is fixed when using plugin-babel as transpiler value instead.

Thank you @guybedford for your example test. It helped me to find the difference between working and non-working instances. I thought transpiler value was not important and only used by the file map.