'this is undefined' when requiring Tween.js with Webpack

593 views Asked by At

I am using Webpack to compile all my JS into one file. The main file has this line in it:

import Tween from 'tween.js'

When I compile my file and open the HTML file that includes the result JS file in my browser, I am getting this error:

TypeError: this is undefined

and the browser console points at these lines of code:

// Include a performance.now polyfill
  (function () {
      // In node.js, use process.hrtime.
      if (this.window === undefined && this.process !== undefined) { // it points to this line of code
          TWEEN.now = function () {
              var time = process.hrtime();

              // Convert [seconds, microseconds] to milliseconds.
              return time[0] * 1000 + time[1] / 1000;
          };
      }

I'm pretty sure that this import line cause if I comment out everything else, this error is still thrown, and if I comment out only this line, everything is working.

If I include the script directly into my HTML file, everything is okay, so I guess that's the Webpack issue.

Here is my Webpack config:

{
  name: 'all scripts',
  entry: {
    'main': ['babel-polyfill', path.join(__dirname, 'clientside', 'client.js')],
  },
  output: {
    path: path.join(__dirname, 'public'),
    filename: '[name].js'
  },
  module:
  {
    loaders: [
      { test: /\.js$/,
        loader: 'babel',
        query: { presets:['es2015', 'stage-0'] }
      }
    ],
  },
}

What am I doing wrong?

0

There are 0 answers