时间戳

首页 > 解决方案 > 如何从资源文件夹动态加载资产到公用文件夹并使用asset（）助手访问它们

laravel - 如何从资源文件夹动态加载资产到公用文件夹并使用asset（）助手访问它们

问题描述

我刚刚安装了 laravel 8.x，当我尝试进入登录页面时，会显示有关加载 CSS 或 js 等文件的错误，但只有位于资源文件夹中的文件，有些人建议将它们从资源文件夹复制到公共文件夹，但对我来说没有任何意义，所以我正在寻找一种方法，可以将文件加载到公共文件夹，就像 laravel 对其他文件（例如查看文件）所做的那样

这是我访问文件的方式

<script src="{{ asset('js/app.js') }}" defer></script>

我的 webpack.mix.js

const mix = require('laravel-mix');

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel applications. By default, we are compiling the CSS
 | file for the application as well as bundling up all the JS files.
 |
 */

mix.js('resources/js/app.js', 'public/js').postCss('resources/css/app.css', 'public/css', [
    require('postcss-import'),
    require('tailwindcss'),
    require('autoprefixer'),
]);

标签： laravellaravel-helper

解决方案

在您webpack.mix.js添加以下代码

const mix = require('laravel-mix');

mix.js('resources/js/app.js', 'public/js').vue().postCss('resources/css/app.css', 'public/css', [
    require('postcss-import'),
    require('tailwindcss'),
    require('autoprefixer'),
]);

最后，您应该在应用程序的主布局模板中引用您的样式表。许多应用程序选择将此模板存储在 resources/views/layouts/app.blade.php 中。此外，请确保添加响应式视口元标记（如果它尚不存在）：

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link href="/css/app.css" rel="stylesheet">
</head>

和 js 喜欢 belwo

你可以在这里阅读https://laravel.com/docs/8.x/mix#postcss

推荐阅读