Laravel - Sass 变量答案

【问题标题】：Laravel - Sass variablesLaravel - Sass 变量
【发布时间】：2021-09-19 15:45:43
【问题描述】：

我来找你是因为我想在 Laravel 项目中使用 Tabulator http://tabulator.info/ 库。我已经在我的项目中正确安装了库（导入 css 和 js 脚本）。终端：

npm install tabulator-tables

resources/js/app.js：

window.Tabulator = require('tabulator-tables/dist/js/tabulator.js');

resources/js/app.scss：

@import 'variables';
@import "../../node_modules/tabulator-tables/dist/css/tabulator.min.css";
@import "../../node_modules/tabulator-tables/dist/css/bootstrap/tabulator_bootstrap.min.css";

为了让表格风格化一点，Tabulator 提供了一个使用 sass 变量的系统。

resources/js/_variables.scss：

$backgroundColor:black;
$headerBackgroundColor: #3F3F3F;
$headerTextColor: #fff;
$borderColor:#FFE6;
$rowTextColor: #000000;
$rowSelectedBackground: #FFE6A8;
@import "../../node_modules/tabulator-tables/dist/css/tabulator_simple.min.css";

但正如documentation http://tabulator.info/docs/4.9/style#sass 中所指出的，覆盖库使用的变量来设置表格样式就足够了。但是当我做npm run dev 时，没有进行任何更改。你有什么想法吗？

【问题讨论】：

标签： laravel sass tabulator

【解决方案1】：

抱歉，我注意到我在resources/scss/app.scss 中导入了错误的文件。

//wrong way
@import "../../node_modules/tabulator-tables/dist/css/tabulator.min.css";
//good way
@import "../../node_modules/tabulator-tables/src/scss/tabulator_simple";

【讨论】：