NUXT引入tailwindcss报错Error: Expected an opening square bracket.

在nuxt项目中引入tailwindcss后,build正式包时报错

ERROR in ./assets/scss/tailwind.scss
Module build failed (from ./node_modules/extract-css-chunks-webpack-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from ./node_modules/postcss-loader/src/index.js):
Error: Expected an opening square bracket.
    at /Users/yld/Documents/work/git/viawallet_developer_frontend/assets/scss/tailwind.scss:1:37
    at Root._error (/Users/yld/Documents/work/git/viawallet_developer_frontend/node_modules/postcss-minify-selectors/node_modules/postcss-selector-parser/dist/parser.js:137:24)
    at Root.error (/Users/yld/Documents/work/git/viawallet_developer_frontend/node_modules/postcss-minify-selectors/node_modules/postcss-selector-parser/dist/selectors/root.js:43:25)
    at Parser.error (/Users/yld/Documents/work/git/viawallet_developer_frontend/node_modules/postcss-minify-selectors/node_modules/postcss-selector-parser/dist/parser.js:392:25)
    at Parser.expected (/Users/yld/Documents/work/git/viawallet_developer_frontend/node_modules/postcss-minify-selectors/node_modules/postcss-selector-parser/dist/parser.js:685:25)
Winter2021/01/28 16:52:20

在你的nuxt.config.js配置禁用focus-within-pseudo-class功能就可以解决这个问题

build: {
    postcss: {
      preset: {
        features: {
          // Fixes: https://github.com/tailwindcss/tailwindcss/issues/1190#issuecomment-546621554
          "focus-within-pseudo-class": false
        }
      }
    }
  }

 

相关问题还可访问https://github.com/nuxt-community/tailwindcss-module/issues/79#issuecomment-609693459