《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 人点赞

从小程序个人账户申请开始，带你一步步进行开发一个微信小程序，直到提交微信控制台上线发布。

你将学到如 RESTFul 设计风格、PostMan 的使用、OAuth 流程，JWT 概念及使用和 API 开发相关的进阶知识。

推荐文章：

更多推荐...

博客

花了四个月打磨的 Laravel Plus 开源 29 / 96 |

试用 Laravel + 树莓派搭建视频监控，并支持线上访问 25 / 19 |

博客

在laravel下实现全双工的websocket开发 21 / 8 |

分享创造

无需修改任何代码和扩展将你的Laravel项目性能提高20倍 99 / 98 |

博客

Laravel 实用小技巧——缓存标签的小秘密（下） 12 / 11 |

博客

Laravel 实用小技巧——缓存标签的小秘密（上） 16 / 6 |

mengdodo

Laravel 9.x 译者 105 声望 / Backend Manager @ 萌嘟嘟 https://www.mengdodo.com/

最佳答案

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

对照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创建文件好了，难受。

2年前评论

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 译者 105 声望 / Backend Manager @ 萌嘟嘟 https://www.mengdodo.com/

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

对照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创建文件好了，难受。

2年前评论

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 译者 105 声望 / Backend Manager @ 萌嘟嘟 https://www.mengdodo.com/

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

2年前评论

Sen （楼主）

辛苦惹~

阿良

课程读者 6 声望

楼上分享的链接失效了

2年前评论

asiol

课程读者 7 声望

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

2年前评论

lxy9500

2 声望

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

2年前评论

zstartw

见习版主 7 声望

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

2年前评论

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

资源推荐

服务提供商

其他信息

请登录