2016-08-31 3 views
0

웹팩에서 문서에 창을 필요로하는 것은jQuery를 내가 ReactJS.net (서버 측 렌더링) 사용하고 있는데 내가 웹팩에서 jQuery를 사용하는 경우 다음 내가 여기에 오류 있어

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 설정

"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",  
     }) 
    ] 
}; 

감사의 말에 감사드립니다.

답변

-1

jQuery는 브라우저에서만 사용하도록 설계되었으며 은 아니며은 서버 측 렌더링을 지원합니다. 서버 측에서 사용할 코드에서 jQuery를 제거해야한다.

+0

답장을 보내 주셔서 감사합니다.하지만 webpack에 의해 libs를 묶는 방법을 보여줄 수 있습니까? 제 시나리오는 bootraps, jQuery, js와 같은 외부 라이브러리를 많이 가지고 있으며 스크립트에 넣지 않으려 고합니다.