《Laravel 9 中文文档》入门套件

课程问答

Laravel8.5使用套件laravel breeze ,所有页面版式都未正确加载

1. 运行环境

windows10+php7.4.30+nginx+laravel8.5+node16.15.1

2. 问题描述？

使用laravel breeze套件,安装后,npm run dev也成功后, 登录网站出现的版式错乱,css,和js未加载成功, @vite([‘resources/css/app.css’, ‘resources/js/app.js’]), @vite未被正确使用.想知道出现这种情况的原因是什么,因为对前端不熟悉, 所以不能定位到问题.所有步骤全部是按照文档来的,并且没有出现任何报错

3. 您期望得到的结果？

能正常显示laravel breeze 的各个页面

4. 您实际得到的结果？

laravel breeze的各个页面版式错乱,没有正常应用css JS

Sen

4 声望

暂无个人描述~

0 人点赞

以构建论坛项目 LaraBBS 为线索，展开对 Laravel 框架的全面学习。应用程序架构思路贴近 Laravel 框架的设计哲学。

从零开始带你一步步开发一个 Go 博客项目，让你在最短的时间内学会使用 Go 进行编码。项目结构很大程度上参考了 Laravel。

推荐文章：

更多推荐...

博客

Laravel 11 中文文档仓库，已翻译完成！！！ 14 / 26 |

博客

Laravel验证器最完整用法实例 31 / 14 |

博客

PHP Annotated——2023 年 12 月 25 / 2 |

分享创造

使用 Laravel 10 & Vue 3 开发了一个社区站，一起来玩下～ 17 / 39 |

博客

历时一个月，《穿透Laravel》全书完成！ 87 / 25 |

面试 POPER 的后端开发工程师的离奇经历 34 / 104 |

mengdodo

Laravel 9.x 译者 102 声望 / Backend Manager @ mengdodo

最佳答案

我今天也踩到这个坑里了。

对照YouTube上最新的这条#54 Authentication-Breeze视频，发现我本地的npm run dev后压根没有mix打包动作。

从七天前的这次修改可以看到官方修改了package.json文件，结果只保留了两项。

        "dev": "vite",
        "build": "vite build"

翻了下官方laravel-breeze文档, npm install && npm run dev命令也没错啊 :joy:。

好吧侦探模式到此结束，直接npm run build创建文件好了，难受。

1年前评论

Sen （楼主）

这个package.json能发一份吗?我发现我的package.json和你得还不一样..我的只有如下:{ "private": true, "scripts": { "dev": "npm run development", "development": "mix", "watch": "mix watch", "watch-poll": "mix watch -- --watch-options-poll=1000", "hot": "mix watch --hot", "prod": "npm run production", "production": "mix --production" }, "devDependencies": { "@tailwindcss/forms": "^0.5.2", "alpinejs": "^3.4.2", "autoprefixer": "^10.4.2", "axios": "^0.21", "laravel-mix": "^6.0.6", "lodash": "^4.17.19", "postcss": "^8.4.6", "tailwindcss": "^3.1.0" } }

讨论数量: 10

mengdodo

Laravel 9.x 译者 102 声望 / Backend Manager @ mengdodo

我今天也踩到这个坑里了。

对照YouTube上最新的这条#54 Authentication-Breeze视频，发现我本地的npm run dev后压根没有mix打包动作。

从七天前的这次修改可以看到官方修改了package.json文件，结果只保留了两项。

        "dev": "vite",
        "build": "vite build"

翻了下官方laravel-breeze文档, npm install && npm run dev命令也没错啊 :joy:。

好吧侦探模式到此结束，直接npm run build创建文件好了，难受。

1年前评论

Sen （楼主）

这个package.json能发一份吗?我发现我的package.json和你得还不一样..我的只有如下:{ "private": true, "scripts": { "dev": "npm run development", "development": "mix", "watch": "mix watch", "watch-poll": "mix watch -- --watch-options-poll=1000", "hot": "mix watch --hot", "prod": "npm run production", "production": "mix --production" }, "devDependencies": { "@tailwindcss/forms": "^0.5.2", "alpinejs": "^3.4.2", "autoprefixer": "^10.4.2", "axios": "^0.21", "laravel-mix": "^6.0.6", "lodash": "^4.17.19", "postcss": "^8.4.6", "tailwindcss": "^3.1.0" } }

mengdodo

Laravel 9.x 译者 102 声望 / Backend Manager @ mengdodo

找到vite的正确用法了，这是一种替代mix的新的前端搞法， learnku.com/docs/laravel/9.x/vite#...

1年前评论

Sen （楼主）

辛苦惹~

阿良

课程读者 6 声望

楼上分享的链接失效了

1年前评论

asiol

课程读者 4 声望

我用breeze V1.9.1就可以了，composer require laravel/breeze:1.9.1 ，新版本好像都用vite 了

1年前评论

lxy9500

2 声望

最后解决的办法呢？ npm install && npm run dev 之后也没有解决

1年前评论

zstartw

见习版主 6 声望

调用composer的时候指定一下breeze的版本 composer require laravel/breeze:"1.9.1" --dev

1年前评论

lxy9500

试过了 1.9.1 和 1.10 都不行

zstartw （作者）

@lxy9500 我这边刚试了是可以的，你可以新建一个项目试一下

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容，与人为善，比聪明更重要！

帮助

Laravel8.5使用套件laravel breeze ,所有页面版式都未正确加载

1. 运行环境

2. 问题描述？

3. 您期望得到的结果？

4. 您实际得到的结果？

推荐文章：

社区赞助商

关于 LearnKu

资源推荐

服务提供商

其他信息

Laravel8.5使用套件laravel breeze ,所有页面版式都未正确加载

1. 运行环境

2. 问题描述？

3. 您期望得到的结果？

4. 您实际得到的结果？

推荐文章：

社区赞助商

关于 LearnKu

资源推荐

服务提供商

其他信息

请登录