React JS 导入 css 文件有表达式 no-unused-expressions

Question

在我的 React JS 应用程序中，在组件中添加导入 CSS 文件
import("./assets/Base.scss");
运行npm start在命令提示符中显示此错误

Line 17:1: Expected an assignment or function call and instead saw an expression no-unused-expressions

第 17:1 行是import("./assets/Base.scss");

我不想导入如下 css 文件
import './assets/Base.scss';
我想用括号导入。

我对.eslintrc.js有一些规则：

"use strict";

const fs = require("fs");
const path = require("path");

const restrictedPaths = [
  { name: "react-bootstrap" },
  { name: "@material-ui/core" }
].map(pkg =>
  fs
    .readdirSync(path.dirname(require.resolve(`${pkg.name}/package.json`)))
    .map(component => ({
      name: `${pkg.name}/${component}`,
      message: `This loads CommonJS version of the package. To fix replace with: import { ${component} } from "${pkg.name}";`
    }))
);

module.exports = {
  extends: "eslint-config-react-app",
  rules: {
    // "no-script-url": "warn",
    "jsx-a11y/anchor-is-valid": "warn",
    "no-restricted-imports": ["error", { paths: [].concat(...restrictedPaths) }]
  }
};

我怎么解决这个问题？
.eslintrc.js规则是否显示错误？

Answer 1

你需要这样写：

import "./assets/Base.scss";

没有括号