4.3. Laravel 前端工作流
Laravel 前端工作流#
接下来讲解 Laravel 是如何利用 Sass, NPM, Yarn, Laravel Mix 来构成一套完整的前端工作流。
SASS 语法基础#
Sass 是一种可用于编写 CSS 的语言,起初由 Hampton Catlin 进行设计并由 Natalie Weizenbaum 开发。借助 Sass 我们可以少写很多 CSS 代码,并使样式代码的编写更加灵活多变。接下来我们将对 Sass 的几个主要功能进行讲解。
1. 样式文件导入#
Sass 使用 @import
来导入其它的样式文件。如:
@import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap";
上面代码将导入存放在 node_modules/bootstrap-sass/assets/stylesheets/bootstrap
文件夹中的所有样式文件。你也可以使用下面代码来对单独一个文件进行导入:
@import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap/_alerts.scss";
2. 变量#
Sass 还允许你在代码中加入变量,所有的变量均以 $
开头。
$navbar-color:...