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.
2 answers
solution1
1 ACCPTED 2019-06-03 12:40:01
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.
solution2
0 2019-06-03 12:58:13
- 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
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.