Блог

Я пытаюсь настроить 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 run prefix-css

> sb-demo-website@1.0.0 prefix-css C:UserstkDocumentsStudywebcssdemo1
> postcss css/style.comp.css -o css/style.prefix.css --use autoprefixer

Error: PostCSS plugin autoprefixer requires PostCSS 8. Update PostCSS or downgrade this plugin.
    at Processor.normalize (C:UserstkDocumentsStudywebcssdemo1node_modulespostcss-clinode_modulespostcsslibprocessor.js:167:15)
    at new Processor (C:UserstkDocumentsStudywebcssdemo1node_modulespostcss-clinode_modulespostcsslibprocessor.js:56:25)
    at postcss (C:UserstkDocumentsStudywebcssdemo1node_modulespostcss-clinode_modulespostcsslibpostcss.js:55:10)
    at C:UserstkDocumentsStudywebcssdemo1node_modulespostcss-cliindex.js:216:14
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! sb-demo-website@1.0.0 prefix-css: `postcss css/style.comp.css -o css/style.prefix.css --use autoprefixer`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the sb-demo-website@1.0.0 prefix-css script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:UserstkAppDataRoamingnpm-cache_logs2020-09-18T17_50_55_597Z-debug.log
  

Любая помощь приветствуется

Похоже, что последняя версия Autoprefixer версии 10.0.0 сейчас немного сломана. Понижение его до версии 9.8.6 решило упомянутую выше проблему.

Я публикую это как ответ на случай, если у кого-то еще возникнут подобные ошибки.