标签: postcss

标题说明了一切。我的 postcss 任务如下：

    postcss: {

      options: {

          processors: [
              require('autoprefixer')({browsers: ['last 2 versions']}),
              require('cssnext')(),
              require('precss')()
            ]
      },
      dist: {
          src: '*.css',
          dest: 'style.css',
      }

    },

目前我有另一个名为 style-human 的 css 文件，我也想添加前缀。但是，该任务仅在 style.css 文件（缩小版本）前加上前缀。

我需要从数据库中获取一些颜色值并在我的 CSS 中使用它们，以便每个客户都有我的 React.js 应用程序的颜色品牌版本，但我不确定如何操作。

我还有其他品牌元素，例如徽标、口号和术语，我从数据库中提取这些元素，存储为 JSON 文件，并在网站周围引用，效果很好，但问题是我需要使用的颜色在我的样式表中，因为我需要使用 CSS 提供的伪类。

我发现这个postcss-import-json包声称可以做到这一点，但我似乎无法让它按预期工作。

到目前为止我已经...

• 导入包... npm install --save-dev postcss-import-json

• 创建了一个名为“masterConfig.json”的 JSON 文件

• 使用我称之为颜色（主要）的名称将上述文件导入到我的主样式表中... :root { @import-json "../Assets/MasterConfig/masterConfig.json" (primary); }

• 将上面的颜色名称添加到我的颜色列表中... :root {primary: primary} 我也尝试过将--前缀更改为@import-json... (primary as primary prefix --)

• ...并将其添加到我的代码中要使用的位置... style={{background: "var(--primary)"}} ^^^ 带或不带前缀

难道我做错了什么？我注意到在示例中它使用了符号$，那么这只能与 SCSS 一起使用吗？

任何对此的帮助，或任何其他方式来实现这一点将是伟大的，谢谢！

我正在尝试配置 PostCSS Autoprefixer 但它不起作用。style.prefix.css它应该在同一个“css”文件夹中输出新文件。请帮助我理解我的 npm 脚本/设置有什么问题

这是我的 package.json

{
  "name": "sb-demo-website",
  "version": "1.0.0",
  "description": "demo website",
  "main": "index.js",
  "scripts": {
    "sass": "node-sass-chokidar sass/main.scss css/style.css -w --recursive --skip-initial",
    "compile-sass": "node-sass-chokidar sass/main.scss css/style.comp.css",
    "prefix-css": "postcss css/style.comp.css -o css/style.prefix.css --use autoprefixer"
  },
  "repository": {
    "type": "git",
    "url": ""
  },
  "author": "tk",
  "license": "ISC",
  "bugs": {
    "url": ""
  },
  "homepage": "",
  "browserslist": "last 3 versions",
  "devDependencies": {
    "autoprefixer": "^10.0.0",
    "node-sass": "^4.14.1",
    "node-sass-chokidar": "^1.5.0",
    "postcss": "^8.0.5",
    "postcss-cli": "^7.1.2"
  }
}

这是我运行脚本时的输出：

$ npm …

在这里，我在添加顺风 CSS 时遇到此错误。此处附有屏幕截图

  [https://i.stack.imgur.com/UC8NS.png][1]
package.json file
  "scripts": {
    "start": "npm run watch:css && react-scripts start",
    "build": "npm run watch:css && react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "buid:css": "postcss src/assets/tailwind.css -o src/assets/main.css",
    "watch:css": "postcss src/assets/tailwind.css -o src/assets/main.css"
  },

当我在这里创建反应应用程序时，出现错误。对于CSS，我使用顺风CSS。我做了几次更改。但错误是相同的。我该如何修复这个错误？