如何在 Laravel 中使用 scss 文件
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/50941780/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to use scss files in Laravel
提问by Simone
I have downloaded a free HTML theme.
我下载了一个免费的 HTML 主题。
If I open index.htmlfile of the theme in the browser it works perfectly.
如果我index.html在浏览器中打开主题文件，它可以完美运行。
However, now I need to integrate this theme in my Laravel Application. If I inspect element in the index.html file loaded in the browser, I can see that some .scss filesare getting called.
但是，现在我需要将此主题集成到我的 Laravel 应用程序中。如果我检查浏览器中加载的 index.html 文件中的元素，我可以看到一些.scss files被调用。
The scss folderis present in the theme folder but I really don't know how to include this into my project
该scss folder存在于主题文件夹，但我真的不知道如何将其纳入到我的项目这
回答by Mohammad Istanboli
You can think of SASS as high level css which provides you with more features like making variable and easier css syntax etc ... but since browsers doesn't understands SASS you have to compile SASS into CSS there are multiple ways to do that.
您可以将 SASS 视为高级 css，它为您提供了更多功能，例如制作变量和更简单的 css 语法等……但是由于浏览器不理解 SASS，您必须将 SASS 编译成 CSS，有多种方法可以做到这一点。
First if your theme folder already has complied SASS (CSS Folder) you can use it if not and want to integrate with Laravel please follow these steps
首先，如果您的主题文件夹已经编译了 SASS（CSS 文件夹），如果没有，您可以使用它并且想要与 Laravel 集成，请按照以下步骤操作
Copy everything in your SASS Folder and place it in "/resources/assets/sass" so they can be found by Laravel to be compiled
now you have to compile SASS into css you can use gulp manually or make use of Laravel mix which is already implemented for you by Laravel
Laravel Ships with packages.json file you will find that in your app root directory so before being able to compile SASS you have to run
npm installin your root directory (make sure that you have npm and node installed)after running
npm installnow you can run either one of these to compile any sass files you have in "resources/assets/sass"npm run dev //this will compile one time only npm run watch //this will keep watching for any changes and compile automatically
复制 SASS 文件夹中的所有内容并将其放在“/resources/assets/sass”中，以便 Laravel 找到它们进行编译
现在你必须将 SASS 编译成 css 你可以手动使用 gulp 或者使用 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
Now your sass files should have been compiled to css you can find the compiled css files in your "public/css" folder.
现在您的 sass 文件应该已经编译为 css，您可以在“public/css”文件夹中找到已编译的 css 文件。
Hopefully you found this helpful you can read more about this in Laravel docs frontend section specifically Laravel Mix here
希望你觉得这有帮助，你可以在 Laravel 文档前端部分阅读更多关于这个的内容，特别是 Laravel Mix在这里
