2017-03-21 12 views
1

私はWebpackには比較的新しいので、https://github.com/erikras/react-redux-universal-hot-exampleを使ってUniversal Reactアプリを作成しようとしています。私は、jQueryを使用して:Webpackを使用してjQueryとjQuery検証を組み込む方法は?

var jquery = new webpack.ProvidePlugin({ 
    $: "jquery", 
    jQuery: "jquery" 
}) 

を含めると、それをグローバルにするためにmodule.exportsプラグインの配列に含めます。そして、私のJSファイルで、私はこの

import $ from 'jquery'; 
import jqueryValidation from 'jquery-validation'; 

ようにそれを含めるようにしようとしていますしかし、私はNodeJSで、次のエラーを取得しています:私は間違って

> error given was: TypeError: $.extend is not a function 
[1]  at /Users/admin/repo/learnReact/node_modules/jquery-validation/dist/jquery.validate.js:19:3 
[1]  at /Users/admin/repo/learnReact/node_modules/jquery-validation/dist/jquery.validate.js:13:20 
[1]  at Object.<anonymous> (/Users/admin/repo/learnReact/node_modules/jquery-validation/dist/jquery.validate.js:17:2) 
[1]  at Module._compile (module.js:570:32) 
[1]  at Module._extensions..js (module.js:579:10) 
[1]  at require.extensions.(anonymous function) (/Users/admin/repo/learnReact/node_modules/babel-register/lib/node.js:152:7) 
[1]  at Object._module2.default._extensions.(anonymous function) [as .js] (/Users/admin/repo/learnReact/node_modules/require-hacker/babel-transpiled-modules/require hacker.js:260:68) 
[1]  at Module.load (module.js:487:32) 
[1]  at tryModuleLoad (module.js:446:12) 
[1]  at Module._load (module.js:438:3) 
[0] ./src/utils/validation.js 

何をしているのですか?オンラインでクイック検索をした後、私はまた、ポストの提案のようにエクスポーズローダーを試しましたが、これもうまくいきませんでした。これを修正したり、良いwebpackチュートリアルを参照したりするのに役立ちます。

+1

reactjsでjqueryを使用しないでください。 –

答えて

1

DOMでのみjqueryを使用できます。その検証

https://www.npmjs.com/package/jquery#node 

あなたはjqueryのを含めたい場合ので、あなたはスクリプトタグ

にjqueryのは、常にDOMと環境で実行されます。この方法を使用してクライアントエントリファイル(WebPACKの)でそれを注入する必要がありません。その後、あなたは窓からjqueryを使用することができます。

(componentDidMount) (componentWillMount does not support DOM afaik)