在使用 scss 的 Vuejs 应用程序中包含 node_modules css答案

【问题标题】：Include node_modules css in Vuejs application that uses scss在使用 scss 的 Vuejs 应用程序中包含 node_modules css
【发布时间】：2020-09-07 13:18:58
【问题描述】：

我已将我的应用程序部署到 aws，并且我看到应用程序呈现正常，但同步融合控件未正确呈现。谷歌浏览器控制台没有显示任何错误。该应用程序在我的本地机器上正确呈现。

为了解决这个问题，建议我将单个 vue 组件中的 import '@syncfusion/**/styles/material.css' 语句移动到 App.vue（如文档中的 here 所示）。但是，我收到“Failed to resolve loader: sass-loader, You may need to install it”错误（应用程序已经安装了 node-sass、sass-loader）。

我应该如何在我的应用程序中包含 css 文件和 scss 文件？

之前：词汇表.vue：

<script>
import '@syncfusion/ej2-base/styles/material.css';
import '@syncfusion/ej2-vue-inputs/styles/material.css';

package.json：

"devDependencies": {
    "node-sass": "^4.12.0",
    "sass-loader": "^7.1.0",
}

vue.config.js：

module.exports = {
  publicPath: '/',
  transpileDependencies: [
    'vue-echarts',
    'resize-detector'
  ],
  configureWebpack: {
    devtool: 'source-map',
    optimization: {
      splitChunks: {
        chunks: 'all'
      }
    }
  }
}

App.Vue：

<style>
@import "../node_modules/@syncfusion/ej2-base/styles/material.css";
@import "../node_modules/@syncfusion/ej2-vue-inputs/styles/material.css";
</style>

【问题讨论】：

在将加载程序添加到package.json 后，您确定运行npm install 吗？
谢谢@Phil。该应用程序已经安装了 node-sass 和 sass-loader，但作为最后的手段，我删除了 npm 包并再次重新安装它们。它奏效了。

标签： css vue.js webpack sass ej2-syncfusion

【解决方案1】：

删除 npm 包并重新安装它们可以解决问题。

【讨论】：