ReferenceError: window not defined when using ExtractTextPlugin in Webpack

I use Webpackto create our project with a plugin ExtractTextPluginto split our CSS into separate files. It works well for most CSS / LESS / SASS files in a project, with the exception of one file, vendor.css, which belongs to a third-party library. As soon as I include this file in my project, I get a ReferenceError: window not defined message . If I do not use ExtractTextPlugin, error messages will not appear.

My webpack.config.js part of the LESS configuration is below (full file here ):

new ExtractTextPlugin(__dirname + '/Content/js/styles/styles.css'),
...
module: {
  {
    test: /\.less$/,
    loader: ExtractTextPlugin.extract(
      'style-loader',
      'css-loader!' +
      'autoprefixer-loader!' +
      'less-loader'
    )
  }
}

Full error message output here .

LESS: styles.js, vendor.less, CSS Bower.

styles.js

require('../../../less/vendor.less');

vendor.less

@import (css) "~vendor-ui-bootstrap/dist/css/arena.css";

arena.css CSS.

+4
2

. webpack.config.js, "jquery" alias:

webpack.config.js

new webpack.ProvidePlugin({
    '_': 'underscore',
    $: 'jquery',
    jQuery: 'jquery',
    'window.jQuery': 'jquery'
}),
...
alias: {
  //'jquery': 'jquery/jquery', - no need to have as I'm using the plugin
  'jquery-bbq': 'jquery-bbq/jquery.ba-bbq',
  'jquery.cookie': 'jquery.cookie/jquery.cookie',
  'jquery.chosen': 'chosen/chosen.jquery.min',
  'jquery.colorpicker': 'jQuery-ColorPicker/colorpicker',
  'jquery.fileupload': 'blueimp-file-upload/js/jquery.fileupload',
  'jquery.scrollTo': 'jquery.scrollto/jquery.scrollTo',
  'jquery.tagsinput': 'jquery-tags-input/src/jquery.tagsinput',
  'jquery.tablednd': 'TableDnD/js/jquery.tablednd',
  'jquery.ui': 'jquery-ui/jquery-ui',
  'jquery.ui.widget': 'blueimp-file-upload/js/vendor/jquery.ui.widget',
  'jquery.validate': 'jquery-validation/dist/jquery.validate',
  'json2': 'JSON-js/json2'
},

, .

+1

. jquery, - window Jasmine puke. , .

jasmine.json

"helpers": [ "helper.js" ],

helper.js

console.log('===============================');
console.log('=====   BEGIN UNIT TEST   =====');
console.log('===============================');

global.window = {};

.

0

Source: https://habr.com/ru/post/1615463/


All Articles