Why SCSS classes is not applied/compiled in Nuxt when pushed to production (AWS)?

I'm developing a website in Nuxt.js. Locally when application is served, the SCSS compiled perfectly and applied on the pages. In my index.vue and other components the styles(SCSS) are scoped.

When I'm deploying the site to production, suddenly none of the styles (scoped) seem working! But if I remove the scoped, it is working on prod as well. But this doesn't feel right way, it totally violated the concept of scoping the styles.

Can anybody help me here? How can I fix this? I doubt something has to do while building the app.

Here is my nuxt.config.js

import path from 'path';

import PurgecssPlugin from 'purgecss-webpack-plugin';
import glob from 'glob-all';
import shrinkRay from 'shrink-ray-current';

require('dotenv').config();

export default {
  mode: 'universal',
   ...
   ...
   ...
  css: ['@/assets/scss/app.scss'],
  plugins: [
    { src: '~/plugins/vue-social-sharing', mode: 'client' },
    { src: '~/plugins/Vuelidate' },
    { src: '~/constants', mode: 'client' },
    { src: '~plugins/ga.js', mode: 'client' }
  ],
  buildModules: [
    // // Doc: https://github.com/nuxt-community/eslint-module
    // '@nuxtjs/eslint-module',
    // // Doc: https://github.com/nuxt-community/stylelint-module
    // '@nuxtjs/stylelint-module'
  ],
  /* Nuxt.js modules */
  modules: ['bootstrap-vue/nuxt', '@nuxtjs/axios', '@nuxtjs/dotenv', 'nuxt-lazy-load'],
  module: {
    rules: [
      {
        test: /\.s[ac]ss$/i,
        use: ['style-loader', 'css-loader', 'sass-loader']
      }
    ]
  },
  bootstrapVue: {
    bootstrapCSS: false,
    bootstrapVueCSS: false
  },
  build: {
    extractCSS: true,
    extend(config, { isDev, isClient }) {
      if (!isDev && isClient) {
        config.plugins.push(
          new PurgecssPlugin({
            paths: glob.sync([
              path.join(__dirname, './pages/**/*.vue'),
              path.join(__dirname, './layouts/**/*.vue'),
              path.join(__dirname, './components/**/*.vue')
            ]),
            whitelist: ['html', 'body']
          })
        );
      }
    }
  }
};