seek-oss/sku

Transpilation differences between create-react-app and sku

davidporter-id-au opened this issue · 2 comments

davidporter-id-au commented

There appears to be something somewhat different in the behaviour of the compilation of this and the create-react-app, where I consistently get my upstream auth0-js library's dependency reqwest failing due to an undefined this:

reqwest.js, as transpiled, looks like this:

!function (name, context, definition) {
  if (typeof module != 'undefined' && module.exports) module.exports = definition();
  else if (true) !(__WEBPACK_AMD_DEFINE_FACTORY__ = (definition),
        __WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?
        (__WEBPACK_AMD_DEFINE_FACTORY__.call(exports, __webpack_require__, exports, module)) :
        __WEBPACK_AMD_DEFINE_FACTORY__),
        __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));else context[name] = definition();
}('reqwest', undefined, function () {

// context here is undefined:
  var context = this;

// causing an error here, because it's attempting to access a property on an undefined object
  if ('window' in context) {
    var doc = document,
        byTag = 'getElementsByTagName',
        head = doc[byTag]('head')[0];
  } else {
    var XHR2;
    try {

Whereas, the working version has the this keyword set correctly, and looks like this I think:

!function (name, context, definition) {
  if (typeof module != 'undefined' && module.exports) module.exports = definition()
  else if (typeof define == 'function' && define.amd) define(definition)
  else context[name] = definition()
}('reqwest', this, function () {

  // context is window here
  var context = this

  if ('window' in context) {
    var doc = document
      , byTag = 'getElementsByTagName'
      , head = doc[byTag]('head')[0]
  } else {
    var XHR2
    try {
      XHR2 = require('xhr2')
    } catch (ex) {
      throw new Error('Peer dependency `xhr2` required! Please npm install xhr2')
    }
  }
  • I don't see any tickets for this error on either the Auth0 library or Reqwest.
  • config for the repo I'm working on is here
markdalgleish commented

Looks like it's because the code is running through Babel, which is treating it as an ES6 module, where this is getting transpiled to undefined. I found a Stack Overflow issue with more details: http://stackoverflow.com/questions/34973442/how-to-stop-babel-from-transpiling-this-to-undefined

To fix this, we probably need to ensure that Babel ignores node modules.

davidporter-id-au commented

Yep, that's fixed it

  • 😄1
  • 🎉1