vue-cli 的 postcss.config 中的 Eslint 错误

Question

我已经开始了一个新的 vue-cli 项目

vue create -n tailwind-demo

? Please pick a preset: Manually select features
? Check the features needed for your project: Babel, TS, PWA, Vuex, Linter
? Use class-style component syntax? Yes
? Use Babel alongside TypeScript (required for modern mode, auto-detected polyfills, transpiling JSX)? Yes
? Pick a linter / formatter config: Prettier
? Pick additional lint features: Lint on save, Lint and fix on commit
? Where do you prefer placing config for Babel, ESLint, etc.? In dedicated config files

我还添加了以下postcss.config.js：

module.exports = {
  plugins: [
    require("postcss-preset-env")({ stage: 0 }),
    require("tailwindcss")(),
    require("autoprefixer")()
  ]
};

当我运行 yarn lint 命令时，出现以下错误

error: Require statement not part of import statement (@typescript-eslint/no-var-requires) at postcss.config.js:3:5:
error: Require statement not part of import statement (@typescript-eslint/no-var-requires) at postcss.config.js:4:5:
error: Require statement not part of import statement (@typescript-eslint/no-var-requires) at postcss.config.js:5:5:

如何导入插件或如何在 Vue CLI 中为 postcss.config.js 配置 eslint？

我尝试过类似的东西

import tailwindCss from "tailwindcss";

但我在构建时收到了SyntaxError: Unexpected identifier。

Answer 1

它似乎适用于以下postcss.config.js

module.exports = {
  plugins: {
    "postcss-preset-env": {
      stage: 0
    },
    tailwindcss: {}
  }
};