如何在Laravel中使用Scss文件

我已经下载了免费的HTML主题。

如果我index.html在浏览器中打开主题文件，则效果很好。

但是，现在我需要将此主题集成到我的Laravel应用程序中。如果我检查浏览器中加载的index.html文件中的元素，则可以看到其中一些.scss files正在被调用。

该scss folder存在于主题文件夹，但我真的不知道如何将其纳入到我的项目这

您可以将SASS视为高级CSS，它为您提供了更多功能，例如使变量更容易使用的CSS语法等...，但是由于浏览器无法理解SASS，因此您必须将SASS编译为CSS，因此有多种方法可以实现。

首先，如果您的主题文件夹已经符合SAS​​S（CSS文件夹）的要求，则可以使用它，并且如果要与Laravel集成，请按照以下步骤操作

将所有内容复制到您的SASS文件夹中，并将其放在“ / resources / assets / sass”中，以便Laravel可以找到它们进行编译

现在您必须将SASS编译为CSS，您可以手动使用gulp或使用Laravel已经为您实现的Laravel混合

Laravel附带packages.json文件，您会在应用程序的根目录中找到该文件，因此在编译SASS之前，必须npm install在根目录中运行（确保已安装了npm和node）

npm install现在运行后，您可以运行其中之一来编译“资源/资产/ sass”中的所有sass文件。

npm run dev //this will compile one time only
npm run watch //this will keep watching for any changes and compile 
automatically

现在，您的sass文件应该已经编译为CSS，您可以在“ public / css”文件夹中找到已编译的CSS文件。

希望你发现这是很有帮助，你可以在Laravel文档前端节专门Laravel混合阅读更多关于此这里