Модуль узла импорта Laravel

Question

У меня проблемы с реализацией узловых модулей с помощью моего приложения Laravel.В моем html-файле у меня вот так.

<link rel="stylesheet" href="node_modules/flag-icon-css/css/flag-icon.min.css">
    <link rel="stylesheet" href="../vendors/gaxon-icon/style.css">

И когда я смотрю на исходный код и открываю эту ссылку, выдает ошибку 404.Как реализовать эту ссылку в моем приложении?

Answer 1

node_modules недоступен с веб-сервера. Фактически единственной точкой входа для приложения Laravel является public/index.php, и невозможно перейти на один каталог вверх.

Вы должны импортировать свои активы в app.scss, что-то вроде этого должно работать

import '~flag-icon-css/css/flag-icon.min'

Не забудьте скомпилировать ваши активы после этого

npm run development (or npm run production when you deploy to your server)

Answer 2

Установить пакет.

npm install lipis/flag-icon-css --save

Эта запись о зависимости теперь должна быть в вашем package.json.

"dependencies": {
    "flag-icon-css": "github:lipis/flag-icon-css",

В /resources/sass/app.scss добавить:

@import '~flag-icon-css/sass/flag-icon';

Создайте свою конфигурацию webpack.mix.js.

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css');

Скомпилируйте ваши активы.

npm run prod

SVG теперь будут помещаться в папку / public / images / vendor /.

Наконец, укажите созданный вами CSS-файл в шаблоне / макете Blade.

<link type="text/css" rel="stylesheet" href="{{ mix('css/app.css') }}">