Angular 2 und jQuery - wie testen?

Question

Ich benutze Angular-CLI (Webpack-Version) für mein Angular 2-Projekt und ich muss auch jQuery verwenden (leider. In meinem Fall ist es eine Abhängigkeit von Semantic-UI und ich verwende es für die Handhabung von Menü Dropdowns).

So wie ich es bin mit:

npm install jquery --save 

darin angular-cli.json Datei im scripts Array Dann Auflistung:

scripts": [ 
    "../node_modules/jquery/dist/jquery.min.js" 
] 

es wird in Bundle-Datei und diese Datei wird automatisch verwendet So enthalten root html-Datei:

<script type="text/javascript" src="scripts.bundle.js">

Dann in Dateien, wo ich es brauche und es funktioniert gut.

Es gibt jedoch ein Problem mit ng test Tests, da Karma einen Fehler $ is not defined ausgibt.

Answer 1

Dies ist, weil die Test-HTML-Datei, die von Karma zur Verfügung gestellt wird, nicht die Datei scripts.bundle.js als normal gedient Version enthält.

Die Lösung ist einfach; Fügen Sie einfach den gleichen Pfad zur jquery-Datei in die Datei im Stammordner des Projekts ein. Diese Datei ist im Stammverzeichnis des Projekts verfügbar.

In files Array, fügen Sie den Pfad mit watched Flag wie folgt aus:

files: [ 
    { pattern: './node_modules/jquery/dist/jquery.min.js', watched: false },  
    { pattern: './src/test.ts', watched: false } 
] 

Karma jetzt über die jQuery Abhängigkeit wissen sollten.