vue-cli4 正式环境无法引入css

Question

最近项目升级到vue-cli4，在测试环境测试通过了，上正式环境样式引不进去

const webpack = require("webpack");  
const path = require("path");  
const resolve \= dir => path.join(\_\_dirname, dir);  
// 打包体积优化  
const BundleAnalyzerPlugin = require("webpack-bundle-analyzer").BundleAnalyzerPlugin;  
  
// 开启gzip压缩  
const CompressionWebpackPlugin \= require('compression-webpack-plugin');  
  
const IS\_PROD = \["production", "prod"\].includes(process.env.NODE\_ENV);  
  
module.exports \= {  
  // publicPath: IS\_PROD ? process.env.PUBLIC\_PATH : "/onlineweb/", // 默认'/'，部署应用包时的基本 URL  
 // 默认'/'，部署应用包时的基本 URL  publicPath: "/onlineweb/",  
  // 'dist', 生产环境构建文件的目录  
  outputDir: 'dist',  
  // 相对于outputDir的静态资源(js、css、img、fonts)目录  
  assetsDir: "static",  
  // 简单/基础配置，比如引入一个新插件  
  configureWebpack: config => {  
    const plugins = \[\];  
  
 if (IS\_PROD) {  
      plugins.push(  
        new CompressionWebpackPlugin({  
          filename: '\[path\].gz\[query\]',  
  algorithm: 'gzip',  
  test: /\\.js$|\\.html$|\\.css/,  
  // 对于超过10K的文件进行压缩  
  threshold: 10240,  
  // 只有压缩率小于这个值的资源才会被处理  
  minRatio: 0.8,  
  // 删除原文件  
  deleteOriginalAssets: false  
  })  
      )  
    }  
  
    config.plugins \= \[...config.plugins, ...plugins\];  
  },  
  chainWebpack: config => {  
    // 修复HMR  
  config.resolve.symlinks(true); 
  // 如果使用多页面打包，使用vue inspect --plugins查看html是否在结果数组中  
  config.plugin("html").tap(args => {  
      // html中添加cdn  
  args\[0\].cdn \= cdn;  
 return args;  
  });  
  
  config  
      .plugin("ignore")  
      .use(  
        new webpack.ContextReplacementPlugin(/moment\[/\\\\\]locale$/, /zh-cn$/)  
      );  
  // 添加别名  
  config.resolve.alias  
  .set("vue$", "vue/dist/vue.esm.js")  
      .set("@", resolve("src"));  
  
 if (IS\_PROD) {  
      // 压缩图片  
  config.module  
  .rule("images")  
        .test(/\\.(png|jpe?g|gif|svg)(\\?.\*)?$/)  
        .use("image-webpack-loader")  
        .loader("image-webpack-loader")  
        .options({  
          bypassOnDebug: true  
  })  
        .end();  
  
  // 打包分析  
  config.plugin("webpack-report").use(BundleAnalyzerPlugin, \[  
        {  
          analyzerMode: "static"  
  }  
      \]);  
  }  
    return config;  
  },  
  // pages,  
  css: {  
    // 设为true将不会热更新css  
  extract: false,  
  sourceMap: false,  
  loaderOptions: {  
      scss: {  prependData: \`  
 @import "~@/styles/variables.scss"; \`  }  
    }  
  },  
  lintOnSave: false,  
  // 是否使用包含运行时编译器的 Vue 构建版本  
  runtimeCompiler: true,  
  // 生产环境的 source map  
  productionSourceMap: !IS\_PROD,  
  parallel: require("os").cpus().length \> 1,  
  pwa: {},  
  devServer: {  
    host: '127.0.0.1',  
  port: 8864,  
  // 自动拉起浏览器  
  open: true,  
  // 热加载  
  hot: true,  
  // 配置多个代理  
  proxy: {  
      '/api': {   
  target: '/', 
  changeOrigin: true,  
  // 是否启用websockets  
  ws: true,  
  pathRewrite: { 
  '^/api': 'http://127.0.0.1:8864/'  
  }  
      }  
    }  
  }  
};

我在loaderOptions里引入了全局变量，全局样式在main.js里引入

import "@/styles/reset.scss"; 

vue文件里还是跟往常一样引入

<style lang\="scss" scoped\>  
 @import '~@/styles/staff/layout.scss';  
</style>

上到正式环境发现引入不到呢 是什么情况呢 请求大神 感谢~