build - 我用 Tailwind 制作的 CSS 不适用于使用 gridsome for netlify 进行构建

Question

当我构建(netflify 构建)我的 Gridsome 个人网站时，tailwind CSS 类不起作用，网站看起来就像没有 CSS。

我已经尝试过不使用 git 进行构建，重新安装 tailwind...

如果这是问题所在，我会显示我的 gridsome 配置:

const tailwind = require('tailwindcss');
const purgecss = require('@fullhuman/postcss-purgecss');

const postcssPlugins = [
  tailwind(),
]

if (process.env.NODE_ENV === 'production') postcssPlugins.push(purgecss());

module.exports = {
  siteName: 'Zolder | Works',
  plugins: [],
  css: {
    loaderOptions: {
      postcss: {
        plugins: postcssPlugins,
      },
    },
  },
}

Answer 1

我也遇到这个问题了。我使用了 Gridsome 的 Tailwind 插件，它可以在本地运行，但部署到 Netlify 时，未添加 Tailwind css。

引用此入门文件:https://github.com/drehimself/gridsome-portfolio-starter/blob/master/src/layouts/Default.vue

我将带有所有 Tailwind 导入文件的 main.css 添加到默认布局模板的末尾，这对我有用。