我如何在 Vue 上使用 Sass 使用 Tailwind

Question

我想在 vue js 上使用帶有 sass 的順風，我正在關注順風文檔，但仍然出現此錯誤

這是我的依賴， postcss是最新的

"dependencies": {
    "autoprefixer": "^10.1.0",
    "core-js": "^3.6.5",
    "postcss": "^8.2.1",
    "postcss-flexbugs-fixes": "^5.0.2",
    "postcss-import": "^14.0.0",
    "postcss-loader": "^4.1.0",
    "postcss-preset-env": "^6.7.0",
    "precss": "^4.0.0",
    "tailwindcss": "^2.0.2",
    "vue": "^2.6.11",
    "vue-router": "^3.2.0",
    "vuex": "^3.4.0"
  },

這是我的postcss.config.js

module.exports = {
  plugins: [
    require('tailwindcss'),
    require('autoprefixer'),
  ]
}

有什么解決辦法嗎？ 我如何在 vue js 上使用帶有 sass 預處理器的順風？ 謝謝大家。

錯誤：PostCSS 插件 tailwindcss 需要 PostCSS 8

Answer 1

嘗試卸載與 postcss 和 tailwind 相關的依賴項：

npm uninstall tailwindcss postcss autoprefixer

然后使用以下命令安裝它們：

npm i -D tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9

根據本節

從 v2.0 開始，Tailwind CSS 依賴於 PostCSS 8。由於 PostCSS 8 才幾個月大，生態系統中的許多其他工具還沒有更新