Link css 和模板的 js(来自供应商)到我的视图

Link css and js of a template (from vendor) to my views

当我在 public 文件夹中添加模板时,这起作用了 但是 我要求的是正确的做事方式。

我创建了一个新的 laravel 项目,我想使用 Adminlte 3 作为模板,所以我 运行 我在文档中找到了这个命令:

composer require "almasaeed2010/adminlte=~3.1"

回复(我认为最后两行可能有用)

./composer.json has been updated
Running composer update almasaeed2010/adminlte
Loading composer repositories with package information
Updating dependencies
Lock file operations: 1 install, 0 updates, 0 removals
  - Locking almasaeed2010/adminlte (v3.1.0)
Writing lock file
Installing dependencies from lock file (including require-dev)
Package operations: 1 install, 0 updates, 0 removals
  - Downloading almasaeed2010/adminlte (v3.1.0)
  - Installing almasaeed2010/adminlte (v3.1.0): Extracting archive
Package swiftmailer/swiftmailer is abandoned, you should avoid using it. Use symfony/mailer instead.
Generating optimized autoload files
> Illuminate\Foundation\ComposerScripts::postAutoloadDump
> @php artisan package:discover --ansi
Discovered Package: facade/ignition
Discovered Package: fruitcake/laravel-cors
Discovered Package: laravel/sail
Discovered Package: laravel/sanctum
Discovered Package: laravel/tinker
Discovered Package: laravel/ui
Discovered Package: nesbot/carbon
Discovered Package: nunomaduro/collision
Package manifest generated successfully.
77 packages you are using are looking for funding.
Use the `composer fund` command to find out more!
> @php artisan vendor:publish --tag=laravel-assets --ansi --force
No publishable resources for tag [laravel-assets].
Publishing complete.

我发现我的供应商文件夹中添加了一个新文件夹。
一切都已正确下载,所以我尝试创建一个母版页,其中包含仪表板的所有重复元素,但是,我使用的 links 不是动态的,所以我不确定如果视图是在不同的目录级别。例如:

这是管理员 lte 3 link 到 css :

  <link rel="stylesheet" href="../../dist/css/adminlte.min.css">

我是怎么称呼它的:

  <link rel="stylesheet" href="{{ require('C:\Users\Yasser-Ch\Desktop\LaravelProject\gestionDivers\vendor\almasaeed2010\adminlte\dist\css\adminlte.min.css') }}">

这使页面看起来像 css 文件,因此尝试将其放入 resources\css\app.css 当然它没有用,因为 css 不是 .blad.php ,所以我想也许是作曲家(因为在文档中准确地说:

The vendor directory contains your Composer dependencies.

) 或其他东西可以解释它并只放入“vendor\almasaeed2010”(一般模板)中我需要的内容,并将其放入 2 个文件中,1 个用于 css,1 个用于 js ...我做了一些研究,发现混合...
所以我试了这个:

  {{ mix.postCss('\vendor\almasaeed2010\adminlte\dist\css\adminlte.min.css', 'public/css') }}
  <link rel="stylesheet" href="adminlte.min.css">

然后我运行这些命令:

  npm install // to download mix that is by default already required in the package.json 
  npm run dev // and here I expect mix to start mixing

我检查 public/css 只添加了 app.css。当我使用 php artisan serve 重新 运行 网站时,我收到一条错误消息,提示 mix is undefined 。
我的意思是 mix 在 npm run dev 期间没有导致错误。我会删除它,如果它在启动服务器之前完成了混合工作。 如何从供应商那里link css/js?我应该发布 public 文件夹中的所有内容吗? 因为我认为他们将模板放在 vendor 文件夹中意味着它不应该直接放在 public 目录中。

你可以为此使用 webpack,检查文件 webpack.mix.js 添加或搜索如下行

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

// in 'app.scss
// import all necessary css files 
@import 'vendor\almasaeed2010\adminlte\dist\css\adminlte.min.css'

运行 npm install 如果没有,则 运行 npm run devnpm run prod。 它将在 public/css

中创建 app.css
<link href="{{ asset('css/app.css') }}" rel="stylesheet">