Блог

Главная - Вопросы по программированию - Невозможно связать Flaticons в моем проекте ReactJS

Невозможно связать Flaticons в моем проекте ReactJS

#javascript #html #reactjs #laravel

#javascript #HTML #reactjs #laravel

Вопрос:

Я следую этим официальным документам как добавить flaticon в проект, у меня есть проект, работающий на php laravel framework и использующий ReactJS

И в моем проекте я использовал шрифт awesome. Это моя структура проекта ->

 Project 
    >app
    >bootstrap
    >database
    >node_modules
    >public
        > css
        > fonts
        > images
        > js
           > app.js (Auto build/generated file during compiling)
        > scss
           > App.css (Auto build/generated file during compiling)
           > Flaticon.css (copied as per the docs)
    > resources
        > js **(Main resource of project)**
            > components
            > assets
            > pages
            > redux
            > **app.js**
            > route.js
            > services
        > lang
        > sass
        > views
             > **welcome.blade.php**

Это мой welcome.blade.php ->

 <!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Fly amp; Carry</title>
        <link href="{{asset('scss/App.css')}}" rel="stylesheet" type="text/css"> 
    // THis is my public/scss/app.css which is auto generated during compiling time.
    
        <link href="{{asset('scss/flaticon.css')}}" rel="stylesheet" type="text/css"> 
    // ---> Newly added Link for flaticon css (Acc. to docs)
    
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.0.0/animate.min.css" />
         <link rel="stylesheet" type="text/css" href="your_website_domain/css_root/flaticon.css"> 
    // What do I need to paste here in place of DOMAIN???
    </head>
    <body>
        <div id="crud-app"></div>
        <script crossorigin src="{{asset('js/app.js')}}" ></script>  
    // --> This is main resource JS file in whiich I am calling Routing and then pages of my app.
    </body>
</html>

пожалуйста, помогите мне в этом, я уже потратил так много времени, если вам нужен какой-либо дополнительный запрос, который я могу вам предоставить.
Любые предложения будут оценены. Спасибо.

Комментарии:

1. Вам не нужно заполнять your_website_domain , и вы уже внедрили flaticon css через синтаксис блейда. Вы можете удалить 2-й тег ссылки для flaticon (тот, который вы скопировали из документов) Единственное, что я могу заметить, это то, что ваш файл назван с большой буквы F — Flaticon.css и вы импортируете строчные {{asset('scss/flaticon.css')}} буквы — может быть, попробуйте изменить это?

2. Вы скопировали файлы шрифтов вместе с CSS? Обычно шрифты также должны находиться в той же папке, что и CSS

3. Большое спасибо за помощь, но я не знаю, теперь он запущен, я просто закрываю все и запускаю заново, и это сработало. И по ошибке я набираю Flaticon.css , это был flaticon.css @Antonio

4. Я не копировал шрифт в тот же файл, так как в этом нет необходимости, потому что все мои шрифты находятся в отдельной папке Fonts. Но все же спасибо за ваши предложения. @abhigunwant Теперь он работает.