scss 使用 laravel-mix 编译成功，但在浏览器中没有变化答案

【问题标题】：scss compiles successfully with laravel-mix but doesnt change in the browserscss 使用 laravel-mix 编译成功，但在浏览器中没有变化
【发布时间】：2020-09-01 21:29:51
【问题描述】：

我看过很多其他类似问题的帖子，但没有一个能解决我的问题。我正在开发一个 laravel 6 应用程序，并在我的 app.scss 代码中添加 css，该代码编译成 app.css。当我运行npm run dev时，laravel mix 编译成功，我刷新了我的浏览器并且....对我的实际 css 没有任何更改。我只是改变一些字体大小，颜色没什么花哨的。任何帮助表示赞赏。

我尝试过的命令列表：

php artisan cache:clear
php artisan view:clear
php artisan clear-compiled
composer dumpautoload
npm run dev
npm run watch
npm run watch-poll
ctrl+f5
ctrl+shift+r
-I inspected the page, found the actual css file in the browser and hard refreshed it.
-I opened the same project in an incognito window
-I tried chrome and firefox and incognito window 
-I updated my version of laravel-mix

这些命令都不起作用，现在我没有想法了。

我的目标刀片文件

<div class="media">
                            <div class="d-flex flex-column .vote-controls">
                                <a title="This question is useful" class="vote-up">
                                    <i class="fas fa-caret-up fa-3x"></i>
                                </a>
                                <span class="votes-count">1234</span>
                                <a title="This question is not useful" class="vote-down off">
                                    <i class="fas fa-caret-down fa-3x"></i>
                                </a>
                                <a title="Click to mark as favorite question (click again to undo)" class="favorite">
                                    <i class="fas fa-star fa-2x"></i>
                                    <span class="favorites-count">1234</span>
                                </a>
                            </div>

app.scss 中的 CSS

.vote-controls {
        min-width: 60px;
        margin-right: 30px;
        text-align: center;
        color: $gray-700;

        span, a {
            display: block;
        }

        span {
            &.votes-count {
                font-size: 25px;
            }

            &.favorites-count {
                font-size: 12px;
            }
        }

        a {
            cursor: pointer;
            color: $gray-600;

            &.off, &.off:hover {
                color: $gray-500;
            }

            &.favorite {
                &.favorited, &.favorited:hover {
                    color: $warning;
                }
            }

            &.vote-accepted {
                color: $green;
            }
        }
    }

【问题讨论】：

标签： css laravel sass laravel-blade

【解决方案1】：

我通过硬刷新浏览器 (cmd+shift+r) 解决了同样的问题。对于 Firefox，我必须关闭开发者控制台并硬刷新才能最终看到更改。在使用 Safari 查看我的页面并查看我所做的样式更改后，我尝试了一下。 Safari 不能像 Firefox 或 Chrome 那样缓存资源。

【讨论】：