1

So currently I am having troubles with autoprefixer.

I have downloaded postcss-cli and autoprefixer to --save-dev and -g

When I run a command like this:

postcss ../../../htdocs/css/workflow/homepage-announcements.css -o ../../../htdocs/css/workflow/homepage-announcements.css

works fine with an output of:

✔ Finished ../../../htdocs/css/workflow/homepage-announcements.css (25ms)

Now that I have used --use autoprefixer an error is thrown. Command below.

postcss --use autoprefixer ../../../htdocs/css/workflow/homepage-announcements.css -o ../../../htdocs/css/workflow/homepage-announcements.css

Error message:

✖ Plugin Error: Cannot find module '../../../htdocs/css/workflow/homepage-announcements.css'

I Have tried everything and still have no solution :(

{
    "name": "homepage-announcements",
    "version": "2.0.0",
    "description": "Homepage announcements",
    "main": "js/Default.js",
    "dependencies": {
       "react": "^15.4.2"
     },
    "devDependencies": {
    "autoprefixer": "^6.7.7",
    "ava": "^0.18.2",
    "babel-loader": "^6.4.1",
    "eslint": "^3.19.0",
    "node-sass": "^4.5.2",
    "postcss": "^5.2.16",
    "postcss-cli": "^3.1.1",
    "webpack": "^2.3.3",
    "xo": "^0.18.1"
    },
    "scripts": {

    "build": "webpack -p && npm run sass && npm run css",
    "sass": "node-sass scss/default.scss ../../../htdocs/css/workflow/homepage-announcements.css --output-style compressed && npm run css",
    "css": "postcss --use autoprefixer ../../../htdocs/css/workflow/homepage-announcements.css -o ../../../htdocs/css/workflow/homepage-announcements.css",
    "lint": "xo js/*.js js/**/*.js js/**/**/*.js js/**/**/**/*.js js/**/**/**/**/*.js js/**/**/**/**/**/*.js"
}
brass monkey
  • 5,841
  • 10
  • 36
  • 61
T Krett
  • 59
  • 1
  • 1
  • 8

4 Answers4

9

I had the same issue and it turns out that the input parameters changed position.

I used to do this and it worked:

postcss --replace --use autoprefixer file.css

... But now it thinks that file.css is a plugin because --use takes an array of plugins.

You have to do this instead now:

postcss file.css --replace --use autoprefixer
Jamie Birch
  • 5,839
  • 1
  • 46
  • 60
greenkarmic
  • 429
  • 4
  • 17
1

Downloading autoprefixer for cross-env worked for me :

npm install autoprefixer@latest cross-env --save-dev
Ayush Shankar
  • 307
  • 2
  • 9
0

"prefix:css": "postcss --use autoprefixer -b 'last 10 versions' css/style.concat.css -o css/style.prefix.css"

I just change the line 'prefix: css' #autoprefixer :"^9.8.5" as given in the code below and remove the -b 'last 10 version' code ,so my command runs successfully.

"prefix:css": "postcss css/style.concat.css -o css/style.prefix.css --use autoprefixer

Hamayun
  • 19
  • 2
0

Add the given scripts in package.json file and run the script in your terminal:

"prefix:css": "postcss --use autoprefixer -o css/style.prefix.css css/style.concat.css"
nedam Kailash
  • 165
  • 1
  • 9