大佬教程收集整理的这篇文章主要介绍了如何在angular2 webpack中使用jquery?获得$not defined,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我想使用jquery和bootstrap.
我做:
npm install jquery bootstrap --save
然后我去vendor.ts添加导入..
import 'jquery'; import 'bootstrap/dist/js/bootstrap'; import 'bootstrap/dist/css/bootstrap.min.css';
然后我去了webpack.common.js并添加到“plugins:[…]”:
new webpack.ProvidePlugin({ jQuery: 'jquery',$: 'jquery',jquery: 'jquery' })
为了测试这一点,我修改了home.component.html并在其中一个div中添加了一个id =“testdiv”.
在home.component.ts中,我添加了“$(‘#testdiv’).html(‘Jquery Works’)”.
当我运行npm时,我收到一堆错误:
error_handler.js:46 EXCEPTION: Uncaught (in promisE): ReferenceError: $is not definedErrorHandler.handleError @ error_handler.js:46next @ application_ref.js:298schedulerFn @ async.js:89SafeSubscriber.__tryOrUnsub @ Subscriber.js:223SafeSubscriber.next @ Subscriber.js:172Subscriber._next @ Subscriber.js:125Subscriber.next @ Subscriber.js:89Subject.next @ Subject.js:55EventEmitter.emit @ async.js:81onError @ ng_zone.js:123onHandleError @ ng_zone_impl.js:62ZoneDelegate.handleError @ zone.js:336Zone.runGuarded @ zone.js:242_loop_1 @ zone.js:508drainMicroTaskQueue @ zone.js:515ZoneTask.invoke @ zone.js:437 error_handler.js:51 ORIGINAL STACKTRACE:ErrorHandler.handleError @ error_handler.js:51next @ application_ref.js:298schedulerFn @ async.js:89SafeSubscriber.__tryOrUnsub @ Subscriber.js:223SafeSubscriber.next @ Subscriber.js:172Subscriber._next @ Subscriber.js:125Subscriber.next @ Subscriber.js:89Subject.next @ Subject.js:55EventEmitter.emit @ async.js:81onError @ ng_zone.js:123onHandleError @ ng_zone_impl.js:62ZoneDelegate.handleError @ zone.js:336Zone.runGuarded @ zone.js:242_loop_1 @ zone.js:508drainMicroTaskQueue @ zone.js:515ZoneTask.invoke @ zone.js:437 error_handler.js:52 Error: Uncaught (in promisE): ReferenceError: $is not defined
我该如何解决这个问题?我还尝试使用以下内容修改webpack.common.js:
new webpack.ProvidePlugin({ 'window.jQuery': 'jquery','window.$': 'jquery',})
也没工作……
<script src="http://code.jquery.com/jquery-3.1.1.min.js"></script>
它有效,但我想避免这样做……
npm install jquery --save npm install @types/jquery --save-dev plugins: [ new webpack.ProvidePlugin({ jQuery: 'jquery',jquery: 'jquery' }) ]
更多信息她
https://github.com/AngularClass/angular2-webpack-starter/wiki/How-to-include-jQuery
不要使用window.jQuery
以上是大佬教程为你收集整理的如何在angular2 webpack中使用jquery?获得$not defined全部内容,希望文章能够帮你解决如何在angular2 webpack中使用jquery?获得$not defined所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。