jQuery 需要一个带有 webpack 文档的窗口 [英] jQuery requires a window with a document in webpack
问题描述
我正在使用 ReactJS.net(服务器端渲染),当我在 Webpack 中使用 jquery 时出现错误这是我的错误
I'm using ReactJS.net (server-side render) and when I use jquery in Webpack then I got error here is my error
将Components.ToDoListSkeleton"渲染到react_0LmYYfSk30qdrKJQe4McUQ":错误:jQuery 需要一个带有文档在 module.exports (Script Document [5]:51:87) -> module.exports=global.document?factory(global,true):function(w){if(!w.document){thrownew Error("jQuery 需要一个带有文档的窗口");}returnfactory(w);};}else {factory(global);}//如果窗口不存在,则传递这个尚未定义在新的 ToDoListSkeleton(脚本文档 [5]:26:903)在 ReactCompositeComponentMixin._constructComponentWithoutOwner(脚本文档 [2]:8271:28)在 ReactCompositeComponentMixin._constructComponent (脚本文档 [2]:8253:22)在 ReactCompositeComponentMixin.mountComponent (脚本文档 [2]:8172:22)在 ReactReconciler.mountComponent(脚本文档 [2]:1977:36)在脚本文档 [2]:19549:37在 Mixin.perform(脚本文档 [2]:3788:21)在 renderToStringImpl(脚本文档 [2]:19544:25)在 renderToString (脚本文档 [2]:19574:11)在脚本文档 [7] [temp]:1:16 行:19549 列:37
Error while rendering "Components.ToDoListSkeleton" to "react_0LmYYfSk30qdrKJQe4McUQ": Error: jQuery requires a window with a document at module.exports (Script Document [5]:51:87) -> module.exports=global.document?factory(global,true):function(w){if(!w.document){throw new Error("jQuery requires a window with a document");}return factory(w);};}else {factory(global);} // Pass this if window is not defined yet at new ToDoListSkeleton (Script Document [5]:26:903) at ReactCompositeComponentMixin._constructComponentWithoutOwner (Script Document [2]:8271:28) at ReactCompositeComponentMixin._constructComponent (Script Document [2]:8253:22) at ReactCompositeComponentMixin.mountComponent (Script Document [2]:8172:22) at ReactReconciler.mountComponent (Script Document [2]:1977:36) at Script Document [2]:19549:37 at Mixin.perform (Script Document [2]:3788:21) at renderToStringImpl (Script Document [2]:19544:25) at renderToString (Script Document [2]:19574:11) at Script Document [7] [temp]:1:16 Line: 19549 Column:37
这是我的 webpack 配置
here is my webpack config
"use strict";
var path = require('path');
var WebpackNotifierPlugin = require('webpack-notifier');
var webpack = require("webpack");
module.exports = {
context: path.join(__dirname, 'Content'),
entry: {
server: './server'
},
output: {
path: path.join(__dirname, 'build'),
filename: '[name].bundle.js'
},
module: {
loaders: [
// Transform JSX in .jsx files
{ test: /\.jsx$/, loader: 'jsx-loader?harmony' },
{ test: require.resolve("jquery"), loader: "expose?$!expose?jQuery" }
]
},
resolve: {
// Allow require('./blah') to require blah.jsx
extensions: ['', '.js', '.jsx']
},
externals: {
//// Use external version of React (from CDN for client-side, or
//// bundled with ReactJS.NET for server-side)
react: "React"
},
plugins: [
new WebpackNotifierPlugin(),
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery",
"window.jQuery": "jquery",
})
]
};
任何帮助或建议将不胜感激,谢谢.
Any help or suggestions would be appreciated, Thanks.
推荐答案
jQuery 仅设计用于浏览器,并且不支持服务器端渲染.您需要从要在服务器端使用的任何代码中删除 jQuery.
jQuery is only designed for use in a browser, and does not support server-side rendering. You'll need to remove jQuery from any of your code that you want to use server-side.
这篇关于jQuery 需要一个带有 webpack 文档的窗口的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!