文章/答案/技术大牛

发布

社区首页 >问答首页 >如何在vercel上使用Tailwincss2.0部署nuxt.js项目

问如何在vercel上使用Tailwincss2.0部署nuxt.js项目
EN

Stack Overflow用户

提问于 2021-02-12 16:38:43

回答 1查看 470关注 0票数 0

我正在尝试用nuxt.js 2.0上传一个基本的tailwind.css项目。我用：

yarn add --dev tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9

安装尾风系统2.0

首先，我使用npm，然后纱线，但在部署尾风2.0不起作用。在当地，效果很好。

nuxt.js

tailwind-css

vercel

autoprefixer

vue.js

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-02-14 20:17:22

如果没有更多的详细信息，我是无法判断的，但是如果您在生产中遇到了困难，而没有在开发尾风项目时遇到困难，那么首先要检查的是您是否使用了动态类名(例如text-${color}-500)。生产中的这些将被清除，除非您将它们添加到允许列表中。

更新

看了一下您提供的回购，问题似乎是Tailwind生成了针对[type='text']的CSS，但这是由html-minifier在您的Nuxt应用程序生成的HTML中清除的(参见问题)。可以在nuxt.config中使用此代码关闭此行为。

export default {
  build: {
    html: {
      minify: {
        collapseBooleanAttributes: true,
        decodeEntities: true,
        minifyCSS: true,
        minifyJS: true,
        processConditionalComments: true,
        removeEmptyAttributes: true,
        // this is the only line we're changing from defaults
        // but we have to include all as they aren't merged
        removeRedundantAttributes: false,
        trimCustomFragments: true,
        useShortDoctype: true
      }
    }
  }
}

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/66175665

复制

相似问题

问如何在vercel上使用Tailwincss2.0部署nuxt.js项目
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在vercel上使用Tailwincss2.0部署nuxt.js项目EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在vercel上使用Tailwincss2.0部署nuxt.js项目
EN