Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
March 20, 2021 07:34 am GMT

How to use node_modules path or third party assets in angular files.

Some times we need to use assets from node_modules in our angular project files.

For example, you are using a third party package and you want to import css files from it in your index.html

If you try to import like this, it gives error:

<link href="./node_modules/some_packge_name/assets/style.css">

So how to resolve this issue ??

We can tell angular to copy required files in build.

We can add glob in angular.json for assets:

build": {          .....           "assets": [...              {                "glob": "**/*",                "input": "./node_modules/some_packge_name/assets",                "output": "./custom-assets"              }            ],...}

input: Path of your assets folder in node_modules
output: Path you want to use in your application.

now we can use it in our index.html as below:

<link href="./custom-asssets/style.css">

If you want to use images from some package, you can use it as shown below:

 <img src="/custom-assets/some-img-file.png" />

Hope you guys find these resources hopeful!


Original Link: https://dev.to/lokeshdaiya/how-to-use-nodemodules-path-or-third-party-assets-in-angular-files-1jdj

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To