Geek Answers Handbook

Installing third-party jquery-ui using angular-cli

I am using angular-cli for my angular2 project. In my project, I want to use jquery-ui. I installed jquery-ui using

npm install jquery jquery-ui

I edited my angular-cli-build.js

 module.exports = function(defaults) { return new Angular2App(defaults, { vendorNpmFiles: [ 'jquery/src/jquery.js', 'jquery-ui/jquery-ui.js' ] }); };

How will it be automatically updated in the dist / vendor folder, do I need to add css files (for example, css / jquery-ui.css) to my index.html?

I followed the integration of the moment. js from this link , but it did not help with jquery-ui. I would appreciate a working example of integrating jquery-ui with angular-cli

+6
source share
3 answers

In your angular-cli-build.js put as:

 'jquery/dist/jquery.min.js', jquery-ui/jquery-ui.min.js', </i>

Then in your system.config.ts file:

 const map: any = { 'jquery': 'vendor/jquery/dist/jquery.min.js', 'jquery.ui': 'vendor/jquery-ui/jquery-ui.min.js',

Hope this helps

0
source

importing scripts into the angular-cli.json file is better suited. You can avoid problems during production deployment.

 "scripts": [ "../node_modules/jquery/dist/jquery.js", "vendor/jquery/dist/jquery.min.js", "'vendor/jquery-ui/jquery-ui.min.js" ],
0
source

It should work, as mentioned above, when adding .js files to the script section in the angular-cli.json file.

With this, add this to your main module class and check if it works.

 import 'jquery'; import 'jquery-ui';
0
source

More articles:


All Articles