找不到模塊'tailwindcss / plugins / container'

Question

我試圖整合tailwindcss到我VueJS項目。

這是我的配置文件：

module.exports = {
  ... other configurations
  plugins: [
    require('tailwindcss/plugins/container')({
      // center: true,
      padding: '2.2rem',
    }),
  ],
  options: {
    prefix: '',
    important: true,
    separator: ':',
  },

};

在.postcssrc.js我們有以下內容：

module.exports = {
  "plugins": [
    require('tailwindcss')('./tailwind-config.js'),
    require('autoprefixer')(),
  ]
};

最后在main.css文件中：

@tailwind base;

@tailwind components;

@tailwind utilities;

但是，每當編譯發生時，我都會收到以下錯誤：

Module build failed (from ./node_modules/postcss-loader/src/index.js):
Error: Cannot find module 'tailwindcss/plugins/container'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:581:15)
    at Function.Module._load (internal/modules/cjs/loader.js:507:25)
    at Module.require (internal/modules/cjs/loader.js:637:17)

我不知道怎么了，請幫忙解決問題。

提前致謝。

Answer 1

根據官方文檔 ， Container plugin現已內置，因此無需將其包含在配置文件的“ plugin”部分中。

因此，您可以通過以下方式修改配置文件：

theme: {
  container: {
    center: true,
    padding: '2.2rem'
  },
},
plugins: [

],

完成這些更改后，它應該可以正確編譯。 另請注意，容器配置選項現在位於配置文件的主題屬性中。