php - 身份验证页面没有在 laravel 中获取 css

Question

我是laravel的初学者。我已经创建了项目。我已经运行了以下命令。

composer require laravel/ui --dev
npm install
npm run dev
php artisan ui vue
php artisan ui vue --auth

在这个命令之后，我在欢迎页面上得到了菜单Login。Register现在我的 laravel 欢迎页面可以正常加载。但是当我点击登录时，它会显示纯 html。我搜索并检查了 app.blade.php 中的 css 和 js 链接。看起来不错。layouts/app.blade.php 具有以下链接

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

问题应该出在哪里？为什么登录和注册没有得到 css，当欢迎页面得到 css 时？请指导。

score 63 · Accepted Answer

步骤1：

下载nodejs
在你的电脑上安装nodejs

第2步：

然后打开你的项目根目录并命令
composer require laravel/ui
php artisan ui vue --auth
npm install
npm run dev

命令后npm它将node_module在您的项目中生成文件夹删除该文件夹。

npm命令仅用于.css和.js文件。

如需帮助，请查看此视频：https ://www.youtube.com/watch?v=hOYW3jqh19I&t=9s

score 18 · Accepted Answer

这个问题的非常简单的解决方案是使用以下cdn

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">

代替

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

我提供的链接是引导 cdn 并检查。它将工作和使用

<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>

代替

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

score 5 · Accepted Answer

在这种情况下，有时缓存可能是问题，您可以运行

php artisan cache:clear和可选php artisan view:clear的。

score 3 · Accepted Answer

您可以从这里下载这两个文件：

然后将css和js文件夹创建到public文件夹中：

CSS 文件：app.css到 project_folder/public/css/

JS 文件：app.js 到 project_folder/public/js/

它为我工作。我认为它也对你有用。谢谢。

score 3 · Accepted Answer

我在 laravel 8 中尝试了以下命令，效果很好

composer require laravel/ui
php artisan ui bootstrap
php artisan ui bootstrap --auth
npm install
npm run dev
npm run production

score 2 · Accepted Answer

我在 laravel 8 中尝试了以下命令，效果很好，您也可以尝试一下。

composer require laravel/ui
php artisan ui bootstrap --auth
npm install
npm run dev
npm run production

score 1 · Accepted Answer

1

npm run watch您必须使用命令编译包。之后你可以运行npm run dev

于 2021-07-08T06:26:49.503 回答

score 1 · Accepted Answer

1

跑

npm install
npm run dev
npm run watch继续编译

于 2021-02-18T04:29:21.807 回答

score 1 · Accepted Answer

您需要清除浏览器上的缓存。要确认进入隐身模式并再次尝试您的 URL。如果它有效，那就是问题所在。

score 1 · Accepted Answer

1

对我来说，这只是npm run dev命令。在我的 ubuntu 19.10 中，它必须使用 sudo 运行

于 2020-04-15T08:52:49.840 回答

score 1 · Accepted Answer

在我看来，您的 node.js 版本已经过时了。只需更新 Node.js 并通过安装 laravel ui 等从头开始。

composer require laravel/ui
php artisan ui vue
php artisan ui vue --auth
npm install
npm run dev

希望它能解决问题。

score 0 · Accepted Answer

我遇到了同样的问题 CSS & js 适用于 CDN 链接，但不适用于默认 CSS。所以在 public/css/app.css 和 js 文件中没有文件没有 CSS 代码，所以我从另一个 laravel 目录复制并粘贴公共目录中的代码和文件，现在可以正常工作了。

score 0 · Accepted Answer

我在实现 in laravel 版本 7 时遇到了同样的问题，composer require laravel/ui但我按照以下步骤修复了它。

第一的：

下载nodejs
在你的电脑上安装nodejs

第二：运行此命令

composer require laravel/ui

安装laravel/ui包后，您可以使用 ui Artisan 命令安装前端脚手架：

// Generate basic scaffolding...
php artisan ui bootstrap
php artisan ui vue
php artisan ui react

// Generate login / registration scaffolding...
php artisan ui bootstrap --auth
php artisan ui vue --auth
php artisan ui react --auth

要在项目中生成node_module文件夹，请运行以下命令

npm install

使用 npm install 安装依赖项后，您可以使用 Laravel Mix 将 SASS 文件编译为纯 CSS。npm run dev 命令将处理 webpack.mix.js 文件中的指令。通常，您编译的 CSS 将放置在 public/css 目录中：

npm run dev

有时您可能需要运行此命令npm audit fix或npm audit fix --force修复某些软件包（如果需要）。

也许通过运行这个命令一段时间，npm run dev或者npm run watch它会显示如下错误。

@ dev C:\xampp\htdocs\Auth
 npm run development 
@ development C:\xampp\htdocs\Auth
mix
        Additional dependencies must be installed. This will only take a moment.
 
        Finished. Please run Mix again.
 
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ development: `mix`

只需npm run watch再次运行它就会Mix █████████████████████████ emitting (95%)在成功后开始构建也将成功。

score 0 · Accepted Answer

您需要为 laravel 7.x 运行以下命令。

解决方案

首先转到您的项目根文件夹 C:\Whatever\Your_project_name>

      composer require laravel/ui

根据您的前端框架尝试以下任何命令。

      php artisan ui vue --auth
      php artisan ui bootstrap --auth
      php artisan ui react --auth

最后别忘了跑

      npm install

如果您的用户界面无法正常工作，请尝试以下命令。

      npm run production

如果上述命令对您不起作用。

原因：错误是因为当您执行了所有命令时，public/css/app.css 中没有 css 代码，但该文件夹中仍然没有代码。

从此处获取文件或代码https://github.com/sabaoonbedar/Css-File-For-Laravel-Developers/tree/master 并将其放在您的项目 public/css/app.css 中，或者如果不创建类似的文件夹存在。

score 0 · Accepted Answer

在您的 Laravel 项目中运行以下命令。

composer require laravel/ui 
php artisan ui bootstrap --auth
npm install
npm run dev

score 0 · Accepted Answer

0

安装完所有东西后试试这个

npm update vue-loader

于 2021-10-11T21:35:59.943 回答

score 0 · Accepted Answer

   composer require laravel/ui

   php artisan ui vue
   npm install
   npm run dev

   php artisan ui vue --auth
   npm install
   npm run dev

你必须调用 npm install 和 npm run dev 来搭建脚手架

score 0 · Accepted Answer

0

这个命令在我的机器命令中工作。

npm run dev

于 2021-07-18T13:30:03.880 回答

score -1 · Accepted Answer

公开你的 CSS。我的意思是将您的 CSS 文件保存在项目的公共目录中。您的 css 文件应位于：yourprojectname\public\css\app.css

score -1 · Accepted Answer

运行命令：

npm uninstall popper.js && npm i @popperjs/core

删除已弃用的软件包并安装他们的新 Popper v2。

php - 身份验证页面没有在 laravel 中获取 css

20 回答 20

您需要为 laravel 7.x 运行以下命令。

Related

Reference