- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我的项目使用 craco 来启动/构建,我希望集成 tailwind postcss。我已遵循本教程 https://dev.to/ryandunn/how-to-use-tailwind-with-create-react-app-and-postcss-with-no-hassle-2i09但结果,我遇到了这个错误:
我的配置文件如下所示:
craco.config.js(这看起来像是问题所在,因为我觉得这种风格可能会覆盖下面的 craco 风格,所以它导致了上述错误,但不是 100% 确定如何解决这个问题。)
module.exports = {
style: {
postcss: {
plugins: [
require("tailwindcss")("./tailwind.config.js"),
require("postcss-nested"),
require("autoprefixer"),
],
},
},
postcss.config.js
const tailwindcss = require('tailwindcss');
module.exports = {
plugins: [
tailwindcss('./tailwind.js'),
require('autoprefixer')
],
};
tailwind.config.js
module.exports = {
purge: ["./src/**/*.html", "./src/**/*.jsx", "./src/**/*.js", "./src/**/*.tx", "./src/**/*.tsx"],
theme: {
extend: {
screens: {
xs: { max: "400px" },
},
},
},
};
我正在运行应用程序
docker-compose up
有什么修复错误和配置的建议吗?请提供一些代码示例提前致谢
最佳答案
您需要卸载 tailwindcss postcss 和 autoprefixer。然后使用这些特定版本重新安装它们
npm install tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9
我遇到了同样的问题!此链接中有更多信息。 https://tailwindcss.com/docs/installation#post-css-7-compatibility-build
关于reactjs - React craco tailwind postcss 集成,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64485516/
npm ERR! While resolving: frontend@0.1.0 npm ERR! Found: react-scripts@5.0.0 npm ERR! node_modules/r
我正在尝试添加 this插件,它使用 this webpack plugin到我的 craco 配置文件,按照指南进行操作,但它不起作用。 const CracoAlias = require('cr
我正在尝试将 Craco 与 Ant-Design 一起使用,但我无法制作合适的主题切换器。有没有更简单的方法来为此实现主题切换器? const CracoLessPlugin = require("
我的项目使用 craco 来启动/构建,我希望集成 tailwind postcss。我已遵循本教程 https://dev.to/ryandunn/how-to-use-tailwind-with-
我正在构建由 create-react-app 提供的 React 应用程序。 我使用 craco 来简化配置,并为 TypeScript 和 Webpack 设置了 alise。 但是当我运行测试命
我必须能够在运行时更改 ant 设计变量(而不是通过无主题文件)。 我用 找到了很多这样的例子定制-cra 和 react-app-rewire-less ,但似乎没有一个适用于 craco。我必须使
文件夹结构: src/index.tsx src/themes/dark.scss src/themes/light.scss ... craco webpack 修改: const path = r
当我将 tailwindcss 更新到版本 3 时,当我意识到老师正在创建和设置他们自己的 craco 时,我正在按照一个关于在框架(如 react)上使用 tailwindcss 的旧教程.conf
编辑:为了遵守 Stackoverflow 指南并让我们所有人的事情变得简单,我提交了一个可重现的小示例来重现我的错误: https://github.com/shackra/stackoverflo
编辑:为了遵守 Stackoverflow 指南并让我们所有人的事情变得简单,我提交了一个可重现的小示例来重现我的错误: https://github.com/shackra/stackoverflo
我正在使用 create react app with craco 和 craco-cesium 将铯加载到我的项目中。我正在尝试设置 jest 以开始创建测试,但问题是 Cesium 正在使用 re
我想用svgr's webpack plugin使用 create-react-app 到 use SVGs with MaterialUI's SvgIcon.我正在使用 craco将 svgr 添
概括 在创建一个新项目并尝试使用 craco 时,我遇到了一个我不明白的错误。 我有什么 错误看起来像这样...... $ craco start (node:125281) UnhandledPro
Storybook 当前调用 react-scripts 。但是,我已经用 craco 覆盖了 CRA 配置的某些部分。这意味着我的应用程序是使用 craco ... 而不是 react-script
我得到了一个 React 项目,我需要使用 Docker Compose 进行容器化。我有一个 Dockerfile: FROM node:latest # Create app directory
我想用ts-nameof在我用 create-react-app 创建的 React 应用程序中.我怎么能在不弹出的情况下做到这一点? 提示:我也用 craco ,所以涉及 craco 的解决方案对我
我在使用 create-react-app 和 craco 设置 webpack 别名路径时遇到问题,已经在谷歌上搜索,但无法解决问题。 我收到一个错误 Module not found: Can't
我试图在运行时通过 require.context 做一些要求在我的 CRA(使用 Typescript)项目中,但我只收到这些类型的错误: TypeError: __webpack_require_
我正在将 ANTd 与我为学校项目构建的 React 应用程序一起使用。该应用程序运行良好,但是在启动时我得到以下信息:craco: *** Cannot find ESLint loader (es
我是一名优秀的程序员,十分优秀!