ReferenceError:在Webpack中使用ExtractTextPlugin时没有定义窗口
我正在使用Webpack
来构build我们的项目ExtractTextPlugin
插件来分离我们的CSS到单独的文件。 它适用于项目中大部分CSS / LESS / SASS文件,除了属于第三方库的一个vendor.css文件。 只要我包含这个文件到我的项目中,我得到ReferenceError:窗口没有定义错误消息。 如果我不使用ExtractTextPlugin
不会出现错误消息。
我的LESSconfiguration的webpack.config.js部分如下(完整文件在这里 ):
new ExtractTextPlugin(__dirname + '/Content/js/styles/styles.css'), ... module: { { test: /\.less$/, loader: ExtractTextPlugin.extract( 'style-loader', 'css-loader!' + 'autoprefixer-loader!' + 'less-loader' ) } }
完整的错误信息输出在这里 。
以下是我导入这个特定的LESS
文件的工作stream程:需要styles.js文件,这需要vendor.less文件,它需要来自Bower目录中第三方库的CSS。
styles.js :
require('../../../less/vendor.less');
vendor.less :
@import (css) "~vendor-ui-bootstrap/dist/css/arena.css";
arena.css包含编译的CSS。
我能解决这个问题。 问题是在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' },
一旦我删除了引用,构build过程就成功了。