Angular 6 : How to use css and js files from cshtml pages of mvc into Angular project

Question

I am trying to migrate a MVC project into Angular 6. I have css files and js files in chtml code which are used in the mvc application as below :

<link rel="stylesheet" href="~/OptumFiles/fonts-clientlibs-global.min.css" type="text/css">
<link rel="stylesheet" href="~/OptumFiles/optum-clientlibs-global.min.css" type="text/css">
<script async="" src="~/OptumFiles/analytics.js"></script>
<script async="" src="~/OptumFiles/js.js"></script>

Now i want to use these files in my angular project globally.

Things i have tried :

Created a folder FICAssets in the Angular project.
Added files in that folder.
Added their reference in index.html file.

Code in index.html :

    <body>
    <link rel="stylesheet" type="css" href="FICAssets/css/fonts-clientlibs-global.min.css">
    <link rel="stylesheet" type="css" href="FICAssets/css/optum-clientlibs-global.min.css">
    <script src="FICAssets/js/analytics.js"></script>
    <script src="FICAssets/js/js.js"></script>
  <app-root></app-root>
</body>

The problem is that iam still not able to load the files , getting 404 error.

Assets are set in the angular.json file. DId you add it to that file ? — user4676340
– user4676340, Commented Jun 3, 2019 at 11:46
No, sorry iam not sure how to do that. Can you please elaborate. — Rpcoder
– Rpcoder, Commented Jun 3, 2019 at 12:35

user4676340 · Accepted Answer · 2019-06-03 12:40:01Z

1

Assets aren't magical, they need to be declared as such.

Open your angular.json file. Find the path

projects.YourProjectName.architect.build.options.assets

And from there, add your declared folder in it. It should keep the assets up when the project is complied.

answered Jun 3, 2019 at 12:40

user4676340

Sign up to request clarification or add additional context in comments.

Comments

Amarat · Accepted Answer · 2019-06-03 12:58:13Z

0

open your angular.json.
add style in "styles": []
add script in "scripts": []

reference link :- https://www.truecodex.com/course/angular-6/how-to-include-external-css-and-js-file-in-angular-6-angular-7

answered Jun 3, 2019 at 12:58

Amarat

6305 silver badges12 bronze badges

Collectives™ on Stack Overflow

Angular 6 : How to use css and js files from cshtml pages of mvc into Angular project

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related