今天，我們要先將 scss 導入專案中，scss 是 css 的預處理器，可以使我們將樣式做許多管理，首先，我們需要將 scss 下載下來，輸入指令

npm install node-sass sass-loader --save-dev

雖然我們使用的是 scss ，但它下掛在 sass 中，因此我們只需要下載 sass 即可；除此之外，我們還需要將編譯好的 scss 轉譯成 css 並且額外產檔出來，我們在這邊額外下載一個 plugin miniCssExtractPlugin，需要額外產生 css 檔不包在 js 檔中是為了減少讀取時間

npm install mini-css-extract-plugin --save-dev

下載完後，我們進入 webpack.config.js 去進行配置

const miniCssExtractPlugin  = require('mini-css-extract-plugin');
module: {
        rules: [
            {
            test: /\.s[ac]ss$/i, //讀取檔名含有 .sass 和 .scss 的檔案
            use: [
                    miniCssExtractPlugin.loader,  
                    'css-loader',
                    'sass-loader'
                 ]
            }
        ]},
    plugins: [
    new miniCssExtractPlugin({
        filename: 'css/style.[hash].css' //產出檔案名稱和位置
    })]

好的，最後我們只需要在 src/index.js 中引用我們的 scss 檔案，並且進行編譯後即可看到我們的 scss 被匯出成 css 檔囉