如何在laravel中链接css和js

Question

你能告诉我如何根据我的文件结构在laravel中链接css和js文件吗 我想将 app.css 和 app.js 链接到 Museum.blade.php （在作品集内）

我尝试过这样的事情：

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

，但没有成功

这是我的文件结构

请帮助我，非常感谢

Answer 1

我尝试过这样的事情：但没有成功

发生这种情况是因为资源文件夹不会被“公共”使用，将被“公共”使用的文件夹是一个公共文件夹，您需要先将它们从资源编译为公共。 Laravel 在 Laravel Mix

有很棒的文档

要解决您的问题，您需要在项目目录中找到一个名为“webpack.mix.js”的文件

并将此混合代码放在上面。

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

然后您可以在命令行运行

npm run dev

来编译资产。

它将把你的目标资源编译到 webpack mix 上并公开。

之后，在你的museum.blade.php的头部，你可以这样称呼它

<link rel="stylesheet" href="{{ mix('css/app.css') }}">
<script src="{{ mix('js/app.js') }}" defer></script>

Answer 2

如果您的项目安装了Vite，您可以将

@vite(['resources/css/app.css','resources/js/app.js'])

放入您的

welcome.blade.php

文件中。

使用 Composer 创建 Laravel 项目时，对于 Laravel 框架版本 10+（不确定以前版本中是否存在），您还应该在主父目录中找到一个

vite.config.js

。使用 Node.js，执行

npm install

，然后 Vite 应该会自动安装并可以按照上面的指定使用。

Answer 3

第一步：在public文件夹中创建一个名为css的文件夹

第二步：将你的css文件放在这里（如public/css/style.css）

第三步：在您的 html 代码中使用此代码链接它

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

享受！