阅读(2012) (9)

Laravel 8 编写 CSS

2021-06-29 14:39:07 更新

在安装 laravel/jetstream 扩展包并生成前端脚手架之后,Laravel 的 package.json 文件将包含 bootstrap 包,以帮助你开始使用 bootstrap 对应用程序的前端进行原型设计。但是你可以根据自己应用的需要,在 package.json 文件中,随意添加或删除依赖包。不是一定要使用 Bootstrap 框架来构建您的 Laravel 应用程序,它只是为想使用它的人提供了一个易用的起点。 

在安装了 laravel/jetstream Composer 软件包并生成前端支架之后,Laravel 的 package.json 文件将包含 Tailwind CSS 软件包,以帮助您开始使用 Tailwind 对应用程序的前端进行原型设计。 不过,您可以根据自己的应用程序的需要,从 package.json 文件中添加或删除软件包。 您也可以不使用 Tailwind 框架来构建 Laravel 应用程序 - 它为选择使用它的人提供了一个很好的起点。

编译 CSS 之前,请使用 Node 包管理器 (NPM) 安装项目前端依赖:

npm install

一旦已经使用 npm install 安装了依赖包,就可以使用 Laravel Mix 将 SASS 编译为原生 CSS。npm run dev 命令将处理 webpack.mix.js 文件中的声明。通常编译后的 CSS 放在 public/css 目录中:

npm run dev 
    

Laravel 前端脚手架附带的 webpack.mix.js 文件将编译 resources/sass/app.scss 文件。 这个 app.css 文件包含了 Tailwind CSS 的正确启动的初始配置。 您可以随意根据需要自定义 app.css 文件。