Input error did not receive any stdin

In simple example it work as sample from readme "cat style.css | postcss -u cssnano > output.css" and also as "cat style.css | postcss -u cssnano -o output.css With more complex s...

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and
privacy statement. We’ll occasionally send you account related emails.

Already on GitHub?
Sign in
to your account


Closed

1ike opened this issue

Apr 9, 2017

· 4 comments

Comments

@1ike

In simple example it work as sample from readme
"cat style.css | postcss -u cssnano > output.css"
and also as
"cat style.css | postcss -u cssnano -o output.css

With more complex string
"postcss -u autoprefixer < style.css | postcss -u cssnano > style.css"
catch error «Input Error: Did not receive any STDIN».

But "postcss -u autoprefixer < style.css | postcss -u cssnano -o style.css" still working.

Features:

  • STDOUT working ("postcss -u autoprefixer < style.css" show printout);
  • switch places for autoprefixer and cssnano does not matter;
  • windows or ubuntu does not matter.

@michael-ciniawsky

- "postcss -u autoprefixer < style.css | postcss -u cssnano > style.css"
+ "cat style.css | postcss -u autoprefixer | postcss -u cssnano -o style.css"

Why not simply cat style.css | postcss -u autoprefixer -u cssnano -o style.css ? 😛

You are not writing to STOUT and pipe the result from the first run to the next

@RyanZim

@discodanser If you’re trying to edit your file in place, just use the --replace (-r) option:

postcss style.css -u autoprefixer cssnano -r

@1ike

michael-ciniawsky, RyanZim

Thnx, that is much better. :)
Before that I used separately

postcss style.css -u autoprefixer -r
postcss style.css -u cssnano -r

But it was not cool of course.

Question appeared when I found answer from SO. And wonder why it does not work for me.

@RyanZim

@discodanser That SO thread was written before postcss-cli v3 was released.

Going to close this out since it seems this is a usage issue.

Содержание

  1. Fix Cannot find module postcss-html/extract error #76
  2. Comments
  3. Gulp > Error: Cannot find module ‘postcss’ #77
  4. Comments
  5. Execution Failure with «npm run serve» — Cannot Find Module «postcss» #3990
  6. Comments
  7. Version
  8. Reproduction link
  9. Environment info
  10. Steps to reproduce
  11. What is expected?
  12. What is actually happening?
  13. Footer
  14. «Plugin error: Cannot find module». Can’t get CLI options to work for me. #149
  15. Comments
  16. Error: Cannot find module ‘postcss-flexbugs-fixes’ after upgrading to 9.3.4 #11783
  17. Comments
  18. Describe the bug
  19. To Reproduce
  20. Expected behavior

Open a markdown file (empty or with content) and receive an error.

What code is needed to reproduce the bug?

Just a markdown file.

What stylelint configuration is needed to reproduce the bug?

Looking at the trace, I don’t think it matters, but I can provide my stylelint config if needed.

Which version of stylelint are you using?

How are you running stylelint: CLI, PostCSS plugin, Node.js API?

What did you expect to happen?

With the old shinnn VSCode plugin, and version 11.0 of stylelint, I had no errors.

What actually happened (e.g. what warnings or errors did you get)?

VSCode reports the following error:

Edit: Might this issue make more sense in the extension’s repository?

The text was updated successfully, but these errors were encountered:

Edit: Might this issue make more sense in the extension’s repository?

Yes, I’ll transfer the issue as I can’t replicate the problem using the CLI.

I’m unable to reproduce this locally. Are you still having the issue with the latest versions of stylelint and the extension?

I’ll check when I have access to that laptop again, next week.

I have the same issue in Markdown and SCSS files, with latest stylelint and stylelint vscode plugin:

stylelint 13.2.1
stylelint vscode 0.83.0
vscode 1.43.0

When saving Markdown files:

When saving SCSS files:

When I do npm install:

When I do npm list postcss:

I solved the issue by rm node_modules package-lock.json && npm install . After that, some postcss packages are installed and updated. I don’t know why.

I had tried that and it didn’t work for me. I could try again when I get back. It seemed to be an issue with guocong3000’s not maintained (recently) postcss-markdown, if I remember.

It seemed to be an issue with guocong3000’s not maintained (recently) postcss-markdown, if I remember.

If it is, then we can address that in our fork.

I had to downgrade to v0.70.0 to fix the problem. It looks like v0.71.0 and later are affected. Removing node_modules and package-lock.json , and running npm i did not fix the problem.

I am still getting this error. Any update on this?

Sorry for late reply.
(I’m currently busy with another job and can’t contribute much to this project.)

I can’t reproduce this issue. Would you share your repository to reproduce the this problem?
(Also include the lock file.)

I just tried to reproduce it on a new project without any success. But I managed to solve it in one of my projects.

Here is what I did:

  1. Uninstall prettier-stylelint
    npm rm prettier-stylelint
    Don’t know why I installed this, but this package seems to install an older version of postcss-html .
  2. rm -rf node_modules package-lock.json && npm install just like @guoyunhe described.

After that the error message for Markdown files and Vue files is gone.

Источник

Gulp > Error: Cannot find module ‘postcss’ #77

Gulp > Error: Cannot find module ‘postcss’
.
schmendrick:site marc$ gulp
[16:11:09] Using gulpfile

/Sites/NYCompost/site/gulpfile.js
[16:11:09] Starting ‘clean’.
[16:11:09] Finished ‘clean’ after 12 ms
[16:11:09] Starting ‘default’.
[16:11:09] Starting ‘styles’.
[16:11:14] ‘styles’ errored after 4.49 s
[16:11:14] Error: Cannot find module ‘postcss’
at Function.Module._resolveFilename (module.js:336:15)
at Function.Module._load (module.js:278:25)
at Module.require (module.js:365:17)
at require (module.js:384:17)
at Object. (/Users/marc/Sites/NYCompost/site/node_modules/gulp-autoprefixer/node_modules/autoprefixer-core/lib/autoprefixer.js:6:13)
at Object. (/Users/marc/Sites/NYCompost/site/node_modules/gulp-autoprefixer/node_modules/autoprefixer-core/lib/autoprefixer.js:111:4)
at Module._compile (module.js:460:26)
at Object.Module._extensions..js (module.js:478:10)
at Module.load (module.js:355:32)
at Function.Module._load (module.js:310:12)
[16:11:14] ‘default’ errored after 4.5 s
[16:11:14] Error: [object Object]
at formatError (/usr/local/lib/node_modules/gulp/bin/gulp.js:169:10)
at Gulp. (/usr/local/lib/node_modules/gulp/bin/gulp.js:195:15)
at Gulp.emit (events.js:129:20)
at Gulp.Orchestrator._emitTaskDone (/Users/marc/Sites/NYCompost/site/node_modules/gulp/node_modules/orchestrator/index.js:264:8)
at /Users/marc/Sites/NYCompost/site/node_modules/gulp/node_modules/orchestrator/index.js:275:23
at finish (/Users/marc/Sites/NYCompost/site/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:21:8)
at cb (/Users/marc/Sites/NYCompost/site/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:29:3)
at finish (/Users/marc/Sites/NYCompost/site/node_modules/run-sequence/index.js:38:5)
at Gulp.onError (/Users/marc/Sites/NYCompost/site/node_modules/run-sequence/index.js:45:4)
at Gulp.emit (events.js:129:20)
[16:11:15] gulp-ruby-sass: directory
[16:11:18] gulp-ruby-sass: write components.css
write components.css.map
[16:11:22] gulp-ruby-sass: write main.css
write main.css.map

The text was updated successfully, but these errors were encountered:

I believe it might be because of your other issue #76.

Hey @mashcode did you manage to get it working?

Hey @mashcode did you manage to get it working?

I wish. I’m using the generator to scaffold three to four small Jekyll projects. The good news? I’ll be knee deep and fix it


Reply to this email directly or view it on GitHub.

This does look like an all-day npm installation issue isn’t it? Try re-running npm install yourself, does that result in anything?

Yes, this is just a broken npm install , try running it again.

Источник

Execution Failure with «npm run serve» — Cannot Find Module «postcss» #3990

Version

Reproduction link

Environment info

Steps to reproduce

  1. Create a new project with vue create myApp.
  2. Selected default preset.
  3. cd into the project directory.
  4. Run npm run serve => Error:

What is expected?

Expected CLI to start local dev server

What is actually happening?

Getting this error whenever I try to run npm run serve

I’ve uninstalled and reinstalled the @vue/cli as well as tried deleting and recreating the project directory.
I have done no customization to this project. It should work as it has every time in the past.

The text was updated successfully, but these errors were encountered:

Can’t reproduce with the provided reproduction repository.

Thanks for trying @sodatea . After deleting and reinstalling the «node_modules» folder of an older project and running the local server I got the same error.

I couldn’t find any help on the net related to my issue but I remembered installing the «@vue/cli-service-global» a short while ago. I uninstalled that as well as uninstalled and reinstalled Node and the Vue CLI then created a new project and it all seems to be working now. Didn’t pinpoint whether it was vue-service-global or Node, or both (as I removed them at the same time), but it’s working again!

© 2023 GitHub, Inc.

You can’t perform that action at this time.

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.

Источник

«Plugin error: Cannot find module». Can’t get CLI options to work for me. #149

I’ve gone through many different combinations of config and terminal commands and I’m not able to get PostCSS CLI to work. I’ve tried these commands:

postcss -c config/postcss.config.js -u postcss-cssnext —dir dist/css src/client/css/*.css
postcss -u postcss-cssnext —dir dist/css src/client/css/*.css

Any ideas ? I’m a bit frustrated — between PostCSS, PostCSS-CLI, and other plugin pages they each suggest different config and methods, none of which have worked for me.

The text was updated successfully, but these errors were encountered:

Either use postcss.config.js or -u both together doesn’t/shouldn’t work 🙂

postcss.config.js

Which module isn’t found ? This normally indicates a dependency (e.g plugin) is missing 😛

Thanks for the info!

OK, I tried the -c and -u options each separately, and still get errors.

When I run postcss -c postcss.config.js , I get the error:
✖ Input Error: Did not receive any STDIN

When I run postcss -u postcss-postcssnext , I get the error:
✖ Plugin Error: Cannot find module ‘postcss-postcssnext’

Since postcss-postcssnext is in my package.json.devDependencies , I’m not sure how else to register the plugin with PostCSS ?

✖ Input Error: Did not receive any STDIN

File I/O needs to be exclusively provided via CLI only, (not in postcss.config.js )

You only need -c|—config if you store the config in a ‘nested’ folder e.g .config [or have multiple ones]

postcss.config.js lookup always starts from dirname(file) and uses the first config found, stops at os.homedir() (Config Cascade). It’s recommended to simply place the config in ‘./’ and forget about it 🙂

✖ Plugin Error: Cannot find module ‘postcss-postcssnext’

‘postcss-postcssnext’ should be ‘postcss-cssnext’ ? Could you with another plugin e.g postcss-nested and see if this is a bug (prepend of postcss- etc) ?

Thanks very much for your detailed response! I was able to get it working because of your guide :). Regarding your last line, I don’t think it is a bug, rather a typo.

I used this command
postcss src/client/css/*.css —dir dist/css —config config/postcss.config.js

with this config

However I do get a warning about autoprefixer duplicates? I didn’t think any of the above plugins also included autoprefixer :
Warning: postcss-cssnext found a duplicate plugin (‘autoprefixer’) in your postcss plugins. This might be inefficient. You should remove ‘autoprefixer’ from your postcss plugin list since it’s already included by postcss-cssnext.

Very happy this is working now :). One last question, when is it necessary to apply the —use flag? From my reading I saw that some plugins (like cssnext ) just run automatically in order, and others need to be invoked with a —use flag. Is this correct, if not how is this applied ?

Источник

Error: Cannot find module ‘postcss-flexbugs-fixes’ after upgrading to 9.3.4 #11783

Describe the bug

next build fails with the error in the title after updating to 9.3.4 with a custom PostCSS config following the current documentation

To Reproduce

Steps to reproduce the behavior, please provide code snippets or a repository:

  1. Create a postcss.config.js with the contents specified here
  2. Update to 9.3.4
  3. No more builds!

Expected behavior

Documentation needs to be updated with the correct «base» PostCSS config for 9.3.4. I know you apparently removed postcss-flexbugs-fixes , but I have no idea what else might have changed.

The text was updated successfully, but these errors were encountered:

You need to install these dependencies yourself, otherwise you’re relying on an implicit dependency from Next.js. We might need to update the docs to make this more clear.

These aren’t MY dependencies, they’re yours. I wouldn’t have them in this file if you didn’t tell me to.

The moment you reference a dependency in your application configuration like postcss.config.js it’s a dependency of your project.

Definitely can be mentioned in the docs that you have to install it, but you can’t reference internal npm dependencies of other dependencies (like next.js) in a safe way as dependencies can change at any time.

An example would be (generic node.js example), you add fs-extra to your project and then import rimraf without adding it to your dependencies.

If you want to rely on Next.js configuring postcss you don’t add postcss.config.js, otherwise it’s up to you as a user to configure it and add the correct dependencies.

postcss-flexbug-fixes was not removed from Next.js for example.

That’s fair, but the documentation should also be updated when you change something like this. If a user right now goes and follows the advice in your docs, their application will break!

Again, the ideal solution would be to offer a way of extending or importing your base config.

Источник

renovate

There is an error with this repository’s Renovate configuration that needs to be fixed. As a precaution, Renovate will stop PRs until it is resolved.

Error type: undefined. Note: this is a nested preset so please contact the preset author if you are unable to fix it yourself.

AlexWayfer

Hello.

I have a directory, like assets/styles/, with .pcss files.

But also I have assets/styles/functions/ directory with .js files for postcss-functions.

And I use PostCSS like this:

postcss assets/styles/ -d public/styles/ --base assets/styles/ --ext=css

But I’m getting the error:

CssSyntaxError: /home/alex/Projects/ruby/test/foo_bar/assets/styles/functions/inputs-with-types.js:2:2: Unknown word

  1 | function inputsWithTypes(...types) {
> 2 | 	return types.map(type => `input[type="${type}"]`).join(', ')
    | 	^
  3 | }
  4 | 

So, I want to exclude this sub-directory from processing or exclude .js files.

cpdtzy

I had installed postcss-cli on location direction.

npm i -D --save-dev postcss-cli

But when I use the postcss.
It was said command not found.

ai

There are popular UX issue:

  1. User install postcss-cli, but forgot to install postcss
  2. postcss-cli takes old postcss 6 or postcss 7 from the deep dependencies
  3. User have true is not a PostCSS plugin without a good explanation

@RyanZim we can solve this problem by checking PostCSS version in postcss-cli:

if (parseInt(postcss().version) < 8) {
  throw new Error('Please install postcss or update it')
}

RavinduDharmasena

When I try to to prefix a css using the command postcss --use autoprefixer -b 'last 10 versions' style.concat.css -o css/style.prefix.css, it throws following error.

TypeError: path.replace is not a function                                                                                   
      at module.exports (G:sass_course_projectsNatours_Media_Queriesnode_modulesslashindex.js:10:14)                     
      at Array.map (<anonymous>)                                                                                              
      at G:sass_course_projectsNatours_Media_Queriesnode_modulespostcss-cliindex.js:66:28                            
npm ERR! code ELIFECYCLE                                                                                               
npm ERR! errno 1                                                                                                        
npm ERR! natours@1.0.0 prefix:css: `postcss --use autoprefixer -b 'last 10 versions' style.concat.css -o css/style.prefix.css`                                                                                                                  npm ERR! Exit status 1                                                                                                  
npm ERR!                                                                                                                
npm ERR! Failed at the natours@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:UsersACERAppDataRoamingnpm-cache_logs2020-12-03T11_27_52_699Z-debug.log 

given below is the debug log file content

0 info it worked if it ends with ok
1 verbose cli [
1 verbose cli   'C:\Program Files\nodejs\node.exe',
1 verbose cli   'C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js',
1 verbose cli   'run',
1 verbose cli   'prefix:css'
1 verbose cli ]
2 info using npm@6.14.8
3 info using node@v12.19.0
4 verbose run-script [ 'prefix:css' ]
5 info lifecycle natours@1.0.0~prefix:css: natours@1.0.0
6 verbose lifecycle natours@1.0.0~prefix:css: unsafe-perm in lifecycle true
7 verbose lifecycle natours@1.0.0~prefix:css: PATH: C:Program Filesnodejsnode_modulesnpmnode_modulesnpm-lifecyclenode-gyp-bin;G:sass_course_projectsNatours_Media_Queriesnode_modules.bin;C:Program Files (x86)InteliCLS Client;C:Program FilesInteliCLS Client;C:Windowssystem32;C:Windows;C:WindowsSystem32Wbem;C:WindowsSystem32WindowsPowerShellv1.0;C:Program Files (x86)IntelIntel(R) Management Engine ComponentsDAL;C:Program FilesIntelIntel(R) Management Engine ComponentsDAL;C:Program Files (x86)IntelIntel(R) Management Engine ComponentsIPT;C:Program FilesIntelIntel(R) Management Engine ComponentsIPT;C:Program Files (x86)NVIDIA CorporationPhysXCommon;C:ProgramDataComposerSetupbin;C:Program FilesGitcmd;C:Program Filesnodejs;C:WINDOWSsystem32;C:WINDOWS;C:WINDOWSSystem32Wbem;C:WINDOWSSystem32WindowsPowerShellv1.0;C:WINDOWSSystem32OpenSSH;G:xampp_PHP5php;G:xamppphp;C:UsersACERAppDataLocalMicrosoftWindowsApps;;C:UsersACERAppDataLocalProgramsMicrosoft VS Codebin;C:UsersACERAppDataRoamingComposervendorbin;C:UsersACERAppDataRoamingnpm
8 verbose lifecycle natours@1.0.0~prefix:css: CWD: G:sass_course_projectsNatours_Media_Queries
9 silly lifecycle natours@1.0.0~prefix:css: Args: [
9 silly lifecycle   '/d /s /c',
9 silly lifecycle   "postcss --use autoprefixer -b 'last 10 versions' style.concat.css -o css/style.prefix.css"
9 silly lifecycle ]
10 silly lifecycle natours@1.0.0~prefix:css: Returned: code: 1  signal: null
11 info lifecycle natours@1.0.0~prefix:css: Failed to exec prefix:css script
12 verbose stack Error: natours@1.0.0 prefix:css: `postcss --use autoprefixer -b 'last 10 versions' style.concat.css -o css/style.prefix.css`
12 verbose stack Exit status 1
12 verbose stack     at EventEmitter.<anonymous> (C:Program Filesnodejsnode_modulesnpmnode_modulesnpm-lifecycleindex.js:332:16)
12 verbose stack     at EventEmitter.emit (events.js:314:20)
12 verbose stack     at ChildProcess.<anonymous> (C:Program Filesnodejsnode_modulesnpmnode_modulesnpm-lifecyclelibspawn.js:55:14)
12 verbose stack     at ChildProcess.emit (events.js:314:20)
12 verbose stack     at maybeClose (internal/child_process.js:1021:16)
12 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:286:5)
13 verbose pkgid natours@1.0.0
14 verbose cwd G:sass_course_projectsNatours_Media_Queries
15 verbose Windows_NT 10.0.19042
16 verbose argv "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" "run" "prefix:css"
17 verbose node v12.19.0
18 verbose npm  v6.14.8
19 error code ELIFECYCLE
20 error errno 1
21 error natours@1.0.0 prefix:css: `postcss --use autoprefixer -b 'last 10 versions' style.concat.css -o css/style.prefix.css`
21 error Exit status 1
22 error Failed at the natours@1.0.0 prefix:css script.
22 error This is probably not a problem with npm. There is likely additional logging output above.
23 verbose exit [ 1, true ]

karlshea

src/css/test.css

postcss.config.js

module.exports = {
  plugins: [
    require('autoprefixer'),
  ],
};

Running ./node_modules/.bin/postcss src/css/test.css --output src/css/test.output.css gets me src/css/test.output.css.

However, switching to this:

module.exports = {
  plugins: [
    require('postcss-import'),
    require('autoprefixer'),
  ],
};

or this:

const tailwindcss = require('tailwindcss'); // Note: I'm not even using it, just importing the plugin.

module.exports = {
  plugins: [
    require('autoprefixer'),
  ],
};

Gets me src/css/test.output.css AND an identical src/css/index.css.

./node_modules/.bin/postcss --version both 8.2.0 and 7.1.2, node --version is v15.0.1. autoprefixer is 9.8.6, postcss-import is 12.0.1, tailwindcss is 1.9.6.

I have no idea what might be happening. Is there any other info that I can provide?

ai

We updated cosmiconfig and the only breaking change is Node.js >= 10 (which is not a breaking change for this project, since PostCSS 8.0 was already limited Node.js to >= 10).

You can release postcss-load-config as a patch release.

SvenBudak

Hello, Sorry for asking things in a issue board, but i cant resist any more. I try now to sience about 8 hours, to make postcss working.

My package.json:

{
  "scripts": {
    "postcss": "postcss --config postcss.json"
  },
  "devDependencies": {
    "autoprefixer": "^7.1.6",
    "bootstrap-sass": "^3.3.7",
    "cssnano": "^3.10.0",
    "node-sass": "^4.5.0",
    "postcss": "^6.0.13",
    "postcss-cli": "^4.1.1",
    "postcss-colormin": "^2.2.2",
  }
}

My postcss.json:

{
  "use": [
    "autoprefixer"
  ],
  "input": "public_html/css/",
  "output": "public_html/css/min/*.css",
  "local-plugins": true,
  "watch": false
}

With this i get a Error when i run «npm run postcss»:

Input Error: Did not receive any STDIN

Okay, Looks like that the —config param dont work. so i tryed to input the files direct in the script:

«postcss»: «postcss public_html/css/**/*.css —base —dir public_html/css/min/»

But what ever i try, i cant make that he collect my 4 css files and keep the folder structure:

public_html/css/style.css
public_html/css/folder/xxx.csss
public_html/css/folder/xxx.csss
public_html/css/folder/xxx.csss

I find here: https://github.com/postcss/postcss-cli in the «Options List» the —base option. So i try it with —base —dir because the documentations says: «Use together with —dir for keeping directory structure.» but when i use them together i get following errors again:

Input Error: Must use —dir or —replace with multiple input files

Im verry short to get mad ;)
Please Help me! :D

MEChasle

Hello,
I use postcss.config.js and it works fine.
I try to use npx postcss my-file-input.css -o output/directory --config my.config.js, but I have the message below.

You did not set any plugins, parser, or stringifier. Right now, PostCSS does nothing. Pick plugins for your case on https://www.postcss.parts/ and use them in postcss.config.js.

Between this two use cases, just the name of config file has changed.
Do I use --config correctly ?

Thanks for your answer.
Regards

RyanZim

  1 test failed [21:00:18]



  error › invalid --config
  /home/ryan/postcss-cli/test/error.js:44

   43:   .then(({ err, code }) => {                         
   44:     t.is(code, 1, 'expected non-zero error code')    
   45:     t.regex(err, /ENOENT: no such file or directory/)

  Actual:

    0

  Expected:

    1

  expected non-zero error code

Attn: @michael-ciniawsky

I suspect this has something to do with the latest patch version of cosmiconfig, will investigate later if no one else beats me to it.

ai

dmuy

Hi,

I have a problem on the above subject. I’m using postcss-cli together with autoprefixer and cssnano.

I run this script:

"css-prefix": "postcss dist/mdtoast.css -u autoprefixer -o dist/mdtoast.css"

And I get this error:

Error: [object Object] is not a PostCSS plugin
    at Processor.normalize (C:Projectspluginstoastnode_modulespostcsslibprocessor.js:168:15)
    at new Processor (C:Projectspluginstoastnode_modulespostcsslibprocessor.js:52:25)
    at postcss (C:Projectspluginstoastnode_modulespostcsslibpostcss.js:55:10)
    at C:Projectspluginstoastnode_modulespostcss-cliindex.js:216:14

This error is only for autoprefixer, there’s no problem with cssnano

Johnny99211

I’ve installed PostCSS and Autoprefixer like this because I want to prefix my .css files:

I’ve tried postcss-cli and postcss-cli-simple but both not working:

npm install postcss-cli-simple autoprefixer -g
npm install postcss-cli autoprefixer -g

After a successful install, I moved into the folder where both libs where installed in:

cd /usr/local/bin

Now I’ve called postcss with the correct --use option to prefix my .css file but the generated file looks exactly like the source — no prefixes — nothing. I’ve tried out everything and also postcss-cli but the result is all the same…

Source menu.css:

#home {
  display: flex;
  transition: 1s;
}

Target file test.css:

#home {
  display: flex;
  transition: 1s;
}

Command which should prefix the content:

postcss --use autoprefixer -o /Applications/MAMP/htdocs/wp-content/plugins/test/assets/css/admin/test.css /Applications/MAMP/htdocs/wp-content/plugins/test/assets/css/admin/menu.css

I’m getting no errors and the files get’s successfully generated but the content is untouched. Any ideas?..

Thanks!

kevinburke1

Say I want to ensure that users are running a given postcss version from a Bash script, or say, ensuring everyone is running a version higher than 6. Normally you would do this by running <binary> --version and parsing the output. However, that’s impossible (or much tougher, anyway) with postcss because this is the output that you get.

$ postcss --version

                                      /|
                                    //   //
                                  //       //
                                //___*___*___//
                              //--*---------*--//
                            /|| *             * ||/
                          // ||*    v7.1.1     *|| //
                        //   || *             * ||   //
                      //_____||___*_________*___||_____//

I could write something that says «look for the fourth token in the sixth line» or something but that’s extremely brittle. I also tried piping the output just to see if it would print something sane, but no, that also prints out version pyramid.

$ postcss --version | cat

                                      /|
                                    //   //
                                  //       //
                                //___*___*___//
                              //--*---------*--//
                            /|| *             * ||/
                          // ||*    v7.1.1     *|| //
                        //   || *             * ||   //
                      //_____||___*_________*___||_____//

This is also frustrating to blind programmers with screen readers. I suggest you paste this output into Text Edit and then turn on VoiceOver for Mac… the output is roughly:

slash vertical bar forward slash slash slash slash slash slash slash slash slash slash slash underscore underscore underscore asterisk underscore underscore underscore asterisk underscore underscore underscore slash slash

and I’m only done with line 3. The version number will eventually print out on line 6.

I understand that it is amusing to print the version string in this way but please consider that users besides humans with working eyesight exist.

jednano

If result.dts has contents, please output a .d.ts file adjacent to the CSS file.

if (result.dts) {
  tasks.push(fs.outputFile(options.to + '.d.ts', result.dts));
}

MattTreichelYeah

Hi, I wanted to use this tool so I could pass a dynamic value to set as an option for a plugin, but I can’t see how that’s possible? Can I not add additional arbitrary properties to the ctx? Maybe I’m missing something obvious, seems like a simple use case.

For example, I want to specify on the cli an arbitrary string value to use as an option for postcss-replace.

huchangfa123

question

I created a monorepo project and i want to set all package with the same postcss.config , the catalog of project as follow:
企业微信截图_63c57975-9b67-4dab-bcd0-a2730a8433b7

so , i put a postcss.config in root directory. And in each package package.json , i set the cli command as follow:
企业微信截图_2464cd77-87a4-4329-ae76-51ca629c58e6

but it’s not work. After testing, i find «—config» as if can only set the directory in below directory , but not upward.

babel can set the config directory use «—root-mode upward» to find the config file in upward directory,
I wish this cli can provide the same command to work , or improve the command «—config» to fixed my question

thanks.

LinAGKar

When trying to do anything with postcss-cli 7.1.1, it fails with Unexpected token {. This happens even if the input file is empty, so the problem is not with the input. 7.1.0 seems to work correctly.

zyy7259

Assumed we have a folder structure like this

postcss src/**/*.css [OPTIONS] only process files in /src/style, but not process files in /src/toast/style.

postcss version v4.1.0

Frieshansen

postcss style.css --o style.min.css generates a seperate style.min.css.map in the output folder if there´s the line /*# sourceMappingURL=style.css.map */ in the input file style.css.

If this line is removed or if the referenced file style.css.map is missing, no style.min.css.map is generated.

Is there a way to keep the line and the file but disable the generation of the map file (‘—no-map’ doesn´t seem to work)?

postcss.config.js:

module.exports = {
    plugins: [
        require('cssnano')({
            preset: 'default',
        }),
    ],
};

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396    1 1   1 1 1 1 1 1   1 1 1   1   1                       1                               1                                                                                                                                                                                     1   1 1   1   1   1                                   1 1   1   1   1   1       1     1       1       1   1   1     1                                                           1                             1 1   1 1 1   1                   1                                                                                                                                                                                           1                                 1 1 1                                           1      
'use strict'
 
const fs = require('fs-promise')
const path = require('path')
 
const ora = require('ora')
const stdin = require('get-stdin')
const read = require('read-cache')
const chalk = require('chalk')
const globber = require('globby')
const chokidar = require('chokidar')
 
const postcss = require('postcss')
const postcssrc = require('postcss-load-config')
const reporter = require('postcss-reporter/lib/formatter')()
 
const depGraph = require('./lib/depGraph')
 
const logo = `
                                      /|\
                                    //   //
                                  //       //
                                //___*___*___//
                              //--*---------*--//
                            /|| *             * ||/
                          // ||*               *|| //
                        //   || *             * ||   //
                      //_____||___*_________*___||_____//
`
 
const version = () => {
  const cli = require('./package.json').version
 
  return chalk.bold.red(`
                                      /|\
                                    //   //
                                  //       //
                                //___*___*___//
                              //--*---------*--//
                            /|| *             * ||/
                          // ||*    v${cli}     *|| //
                        //   || *             * ||   //
                      //_____||___*_________*___||_____//
  `)
}
 
const argv = require('yargs')
  .usage(
`${chalk.bold.red(logo)}
Usage:
 
  $0 [input.css] [OPTIONS] [--output|-o output.css] [--watch]`
)
  .option('o', {
    alias: 'output',
    desc: 'Output file',
    type: 'string'
  })
  .option('d', {
    alias: 'dir',
    desc: 'Output directory',
    type: 'string'
  })
  .option('r', {
    alias: 'replace',
    desc: 'Replace (overwrite) the input file',
    type: 'boolean'
  })
  .option('u', {
    alias: 'use',
    desc: 'List of postcss plugins to use',
    type: 'array'
  })
  .option('p', {
    alias: 'parser',
    desc: 'Custom postcss parser',
    type: 'string'
  })
  .option('t', {
    alias: 'stringifier',
    desc: 'Custom postcss stringifier',
    type: 'string'
  })
  .option('s', {
    alias: 'syntax',
    desc: 'Custom postcss syntax',
    type: 'string'
  })
  .option('w', {
    alias: 'watch',
    desc: 'Watch files for changes and recompile as needed',
    type: 'boolean'
  })
  .option('poll', {
    desc: 'Use polling for file watching',
    type: 'boolean'
  })
  .option('x', {
    alias: 'ext',
    desc: 'Override the output file extension',
    type: 'string',
    coerce (ext) {
      if (ext.indexOf('.') !== 0) return '.' + ext
      return ext
    }
  })
  .option('e', {
    alias: 'env',
    desc: 'A shortcut for setting NODE_ENV',
    type: 'string'
  })
  .option('b', {
    alias: 'base',
    desc: 'Mirror the directory structure relative to this path in the output directory, this only works together with --dir',
    type: 'string'
  })
  .option('c', {
    alias: 'config',
    desc: 'Set a custom path to look for a config file',
    type: 'string'
  })
  .alias('m', 'map')
    .describe('m', 'Create an external sourcemap')
    .describe('no-map', 'Disable the default inline sourcemaps')
  .version(version).alias('v', 'version')
  .help('h').alias('h', 'help')
  .example('$0 input.css -o output.css', 'Basic usage')
  .example('cat input.css | $0 -u autoprefixer > output.css', 'Piping input & output')
  .epilog(
`If no input files are passed, it reads from stdin. If neither -o, --dir, or --replace is passed, it writes to stdout.
 
If there are multiple input files, the --dir or --replace option must be passed.
 
For more details, please see https://github.com/postcss/postcss-cli`
  )
  .argv
 
let dir = argv.dir
 
let input = argv._
let output = argv.output
 
Iif (argv.map) argv.map = { inline: false }
 
const spinner = ora()
 
let config = {
  options: {
    map: argv.map !== undefined ? argv.map : { inline: true },
    parser: argv.parser ? require(argv.parser) : undefined,
    syntax: argv.syntax ? require(argv.syntax) : undefined,
    stringifier: argv.stringifier ? require(argv.stringifier) : undefined
  },
  plugins: argv.use
    ? argv.use.map((plugin) => {
      try {
        return require(plugin)()
      } catch (e) {
        error(`Plugin Error: Cannot find module '${plugin}'`)
      }
    })
    : []
}
 
Iif (argv.env) process.env.NODE_ENV = argv.env
Iif (argv.config) argv.config = path.resolve(argv.config)
 
Promise.resolve()
  .then(() => {
    Iif (input && input.length) return globber(input)
 
    Iif (argv.replace || argv.dir) error('Input Error: Cannot use --dir or --replace when reading from stdin')
 
    Iif (argv.watch) {
      error('Input Error: Cannot run in watch mode when reading from stdin')
    }
 
    return ['stdin']
  })
  .then((i) => {
    Iif (!i || !i.length) {
      error('Input Error: You must pass a valid list of files to parse')
    }
 
    Iif (i.length > 1 && !argv.dir && !argv.replace) {
      error('Input Error: Must use --dir or --replace with multiple input files')
    }
 
    Iif (i[0] !== 'stdin') i = i.map(i => path.resolve(i))
 
    input = i
 
    return files(input)
  })
  .then((results) => {
    Iif (argv.watch) {
      const watcher = chokidar.watch(
        input.concat(dependencies(results)),
        { usePolling: argv.poll }
      )
 
      if (config.file) watcher.add(config.file)
 
      watcher
        .on('ready', (file) => console.warn(chalk.bold.cyan('Waiting for file changes...')))
        .on('change', (file) => {
          let recompile = []
 
          if (~input.indexOf(file)) recompile.push(file)
 
          recompile = recompile.concat(
            depGraph.dependantsOf(file).filter(file => ~input.indexOf(file))
          )
 
          if (!recompile.length) recompile = input
 
          return files(recompile)
            .then((results) => watcher.add(dependencies(results)))
            .then(() => console.warn(chalk.bold.cyan('Waiting for file changes...')))
            .catch(error)
        })
    }
  })
  .catch(error)
 
function rc (ctx, path) {
  if (argv.use) return Promise.resolve()
 
  return postcssrc(ctx, path)
    .then((rc) => {
      if (rc.options.from || rc.options.to) {
        error('Config Error: Can not set from or to options in config file, use CLI arguments instead')
      }
      config = rc
    })
    .catch((err) => {
      if (err.message.indexOf('No PostCSS Config found') === -1) throw err
    })
}
 
function files (files) {
  Iif (typeof files === 'string') files = [ files ]
 
  return Promise.all(files.map((file) => {
    Eif (file === 'stdin') {
      return stdin()
        .then((content) => {
          Eif (!content) return error('Input Error: Did not receive any STDIN')
          return css(content, 'stdin')
        })
    }
 
    return read(file)
      .then((content) => css(content, file))
  }))
}
 
function css (css, file) {
  const ctx = { options: config.options }
 
  if (file !== 'stdin') {
    ctx.file = {
      dirname: path.dirname(file),
      basename: path.basename(file),
      extname: path.extname(file)
    }
 
    if (!argv.config) argv.config = path.dirname(file)
  }
 
  const relativePath = file !== 'stdin' ? path.relative(path.resolve(), file) : file
 
  if (!argv.config) argv.config = process.cwd()
 
  const time = process.hrtime()
 
  spinner.text = `Processing ${relativePath}`
  spinner.start()
 
  return rc(ctx, argv.config)
    .then(() => {
      let options = config.options
 
      if (file === 'stdin' && output) file = output
 
      // TODO: Unit test this
      options.from = file === 'stdin' ? path.join(process.cwd(), 'stdin') : file
 
      if (output || dir || argv.replace) {
        options.to = output || (argv.replace ? file : path.join(dir, argv.base ? file.replace(path.resolve(argv.base), '') : path.basename(file)))
 
        if (argv.ext) {
          options.to = options.to
            .replace(path.extname(options.to), argv.ext)
        }
 
        options.to = path.resolve(options.to)
      }
 
      if (!options.to && config.options.map && !config.options.map.inline) {
        spinner.fail()
        error('Output Error: Cannot output external sourcemaps when writing to STDOUT')
      }
 
      return postcss(config.plugins)
        .process(css, options)
        .then((result) => {
          const tasks = []
 
          if (options.to) {
            tasks.push(fs.outputFile(options.to, result.css))
 
            if (result.map) {
              tasks.push(
                fs.outputFile(
                  options.to
                    .replace(
                      path.extname(options.to),
                      path.extname(options.to) + '.map'
                    ),
                    result.map
                )
              )
            }
          } else {
            spinner.text = chalk.bold.green(
              `Finished ${relativePath} (${Math.round(process.hrtime(time)[1] / 1e6)}ms)`
            )
            spinner.succeed()
            return process.stdout.write(result.css, 'utf8')
          }
 
          return Promise.all(tasks)
            .then(() => {
              spinner.text = chalk.bold.green(
                `Finished ${relativePath} (${Math.round(process.hrtime(time)[1] / 1e6)}ms)`
              )
              if (result.warnings().length) {
                spinner.fail()
                console.warn(reporter(result))
              } else spinner.succeed()
 
              return result
            })
        })
    }).catch((err) => {
      spinner.fail()
      throw err
    })
}
 
function dependencies (results) {
  if (!Array.isArray(results)) results = [ results ]
 
  const messages = []
 
  results.forEach((result) => {
    if (result.messages <= 0) return
 
    result.messages
      .filter((msg) => msg.type === 'dependency' ? msg : '')
      .map(depGraph.add)
      .forEach((dependency) => messages.push(dependency.file))
  })
 
  return messages
}
 
function error (err) {
  Eif (typeof err === 'string') {
    spinner.fail(chalk.bold.red(err))
  } else if (err.name === 'CssSyntaxError') {
    console.error('n')
 
    spinner.text = spinner.text.replace('Processing ', '')
    spinner.fail(chalk.bold.red(`Syntax Error: ${spinner.text}`))
 
    if (err.file) {
      err.message = err.message.substr(err.file.length + 1)
    } else {
      err.message = err.message.replace('<css input>:', '')
    }
 
    err.message = err.message.replace(/:s/, '] ')
 
    console.error('n', chalk.bold.red(`[${err.message}`))
    console.error('n', err.showSourceCode(), 'nn')
 
    if (argv.watch) return
  } else {
    console.error(err)
  }
  process.exit(1)
}
 
 

Понравилась статья? Поделить с друзьями:
  • Input error attribute
  • Input device error no input device selected 23 wrong device selected please check settings 23
  • Input conversion failed due to input error bytes 0x98 0xd0 0xb4 0xd0
  • Input contains nan infinity or a value too large for dtype float64 как исправить
  • Input axis horizontal is not setup ошибка как исправить