Skip to content
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

@tailwindcss/jit doesn't work #22

Closed
exalted opened this issue Mar 16, 2021 · 8 comments · Fixed by #32
Closed

@tailwindcss/jit doesn't work #22

exalted opened this issue Mar 16, 2021 · 8 comments · Fixed by #32

Comments

@exalted
Copy link

exalted commented Mar 16, 2021

@tailwindcss/jit is very recently announced and this gem doesn't seem to work with it:

npm install @tailwindcss/jit first and then add @tailwindcss/jit to your postcss.config.js:

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

Here's the error:

Configuration file: /Users/foo/example/_config.yml
            Source: /Users/foo/example
       Destination: /Users/foo/example/_site
 Incremental build: disabled. Enable with --incremental
      Generating...
PostCSS Server listening on port 8124...
PostCSS Error!

Error: ENOENT: no such file or directory, stat 'stdin'
@colejd
Copy link

colejd commented Mar 16, 2021

I've also run into this error, which I've logged as an issue on the JIT here.

I think the ENOENT error is just an artifact of running the build command through a watcher. When I invoke the build command directly with the --trace flag enabled, I get this:

Conversion error: Jekyll::Converters::PostCss encountered an error while converting 'assets/css/main.css':
                    783: unexpected token at ''

@jeroenboumans
Copy link

jeroenboumans commented Apr 10, 2021

Following the JIT setup I've encountered an error building with Jekyll: Error: ENOENT: no such file or directory, stat 'stdin'. Did you manage to get JIT up and running with Jekyll eventually

  1. Install npm dependency:
npm install @tailwindcss/jit
  1. Configure the tailwind config file:
module.exports = {
    mode: 'jit',
    purge: [
        ...
  1. Add it to the postcss.config.js:
module.exports = {
    plugins: [
        require('postcss-import'),
        require('tailwindcss')("./tailwind.config.js"),
        require('autoprefixer'),
        ...(process.env.JEKYLL_ENV == "production"
            ? [require('cssnano')({ preset: 'default' })]
            : [])
    ]
};
  1. CSS file:
---
---
@import "tailwindcss/base";
@import "tailwindcss/components";
...
  1. Run build command:
NODE_ENV=production JEKYLL_ENV=production bundle exec jekyll build --trace 

Log:

 Incremental build: disabled. Enable with --incremental
      Generating...
         AutoPages: Disabled/Not configured in site.config.
        Pagination: Complete, processed 1 pagination page(s)
       Jekyll Feed: Generating feed for posts

warn - You have enabled the JIT engine which is currently in preview.
warn - Preview features are not covered by semver, may introduce breaking changes, and can change at any time.
PostCSS Error!

Error: ENOENT: no such file or directory, stat 'stdin'
  Conversion error: Jekyll::Converters::PostCss encountered an error while converting 'style.css':
                    809: unexpected token at ''
bundler: failed to load command: jekyll (/usr/local/lib/ruby/gems/3.0.0/bin/jekyll)
/usr/local/Cellar/ruby/3.0.1/lib/ruby/3.0.0/json/common.rb:216:in `parse': 809: unexpected token at '' (JSON::ParserError)
	from /usr/local/Cellar/ruby/3.0.1/lib/ruby/3.0.0/json/common.rb:216:in `parse'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-postcss-0.4.0/lib/jekyll-postcss/socket.rb:43:in `decode'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-postcss-0.4.0/lib/jekyll-postcss/socket.rb:32:in `read'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-postcss-0.4.0/lib/jekyll/converters/postcss.rb:41:in `convert'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/renderer.rb:106:in `block in convert'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/renderer.rb:104:in `each'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/renderer.rb:104:in `reduce'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/renderer.rb:104:in `convert'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/renderer.rb:84:in `render_document'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/renderer.rb:63:in `run'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/site.rb:547:in `render_regenerated'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/site.rb:539:in `block in render_pages'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/site.rb:538:in `each'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/site.rb:538:in `render_pages'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/site.rb:211:in `render'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/site.rb:80:in `process'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/command.rb:28:in `process_site'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/commands/build.rb:65:in `build'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/commands/build.rb:36:in `process'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/command.rb:91:in `block in process_with_graceful_fail'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/command.rb:91:in `each'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/command.rb:91:in `process_with_graceful_fail'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/lib/jekyll/commands/build.rb:18:in `block (2 levels) in init_with_program'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/mercenary-0.4.0/lib/mercenary/command.rb:221:in `block in execute'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/mercenary-0.4.0/lib/mercenary/command.rb:221:in `each'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/mercenary-0.4.0/lib/mercenary/command.rb:221:in `execute'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/mercenary-0.4.0/lib/mercenary/program.rb:44:in `go'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/mercenary-0.4.0/lib/mercenary.rb:21:in `program'
	from /usr/local/lib/ruby/gems/3.0.0/gems/jekyll-4.2.0/exe/jekyll:15:in `<top (required)>'
	from /usr/local/lib/ruby/gems/3.0.0/bin/jekyll:23:in `load'
	from /usr/local/lib/ruby/gems/3.0.0/bin/jekyll:23:in `<top (required)>'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/bundler-2.2.15/lib/bundler/cli/exec.rb:63:in `load'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/bundler-2.2.15/lib/bundler/cli/exec.rb:63:in `kernel_load'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/bundler-2.2.15/lib/bundler/cli/exec.rb:28:in `run'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/bundler-2.2.15/lib/bundler/cli.rb:494:in `exec'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/bundler-2.2.15/lib/bundler/vendor/thor/lib/thor/command.rb:27:in `run'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/bundler-2.2.15/lib/bundler/vendor/thor/lib/thor/invocation.rb:127:in `invoke_command'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/bundler-2.2.15/lib/bundler/vendor/thor/lib/thor.rb:392:in `dispatch'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/bundler-2.2.15/lib/bundler/cli.rb:30:in `dispatch'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/bundler-2.2.15/lib/bundler/vendor/thor/lib/thor/base.rb:485:in `start'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/bundler-2.2.15/lib/bundler/cli.rb:24:in `start'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/bundler-2.2.15/exe/bundle:49:in `block in <top (required)>'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/bundler-2.2.15/lib/bundler/friendly_errors.rb:130:in `with_friendly_errors'
	from /Users/jeroenboumans/.gem/ruby/3.0.0/gems/bundler-2.2.15/exe/bundle:37:in `<top (required)>'
	from /usr/local/opt/ruby/bin/bundle:23:in `load'
	from /usr/local/opt/ruby/bin/bundle:23:in `<main>'

@MisterJimson
Copy link

Also running into this

@stefcoetzee
Copy link

Exactly the same problem on my side, not sure how to resolve. Any ideas @mhanberg?

@ENT8R
Copy link

ENT8R commented Aug 22, 2021

I think the issue is that this plugin passes a string with "stdin" to the PostCSS configuration. While this might be true for this plugin, Tailwind assumes that this parameter is an existing file to check for modifications to run the JIT engine, which leads to this error.

This error is likely triggered by Tailwind making use of fs.statSync(decodeURIComponent(pathname)).mtimeMs where specifically fs.statSync(decodeURIComponent("stdin")).mtimeMs leads to the error messages above if there is no file called "stdin" in the current working directory.

I guess the correct solution would be to set the from parameter to undefined, unless there is some method to pass the actual path of the CSS source file to PostCSS for further processing:

class PostCSS {
  static process(data, write) {
    postcss(config.plugins)
-     .process(JSON.parse(data).raw_content, { from: "stdin" })
+     .process(JSON.parse(data).raw_content, { from: undefined })
      .then((result) => write(result))
      .catch((error) => {
        console.error("PostCSS Error!\n");
        console.error(error.toString());
      });
  }

@jessetrippe
Copy link

Just ran into this.

@jessetrippe
Copy link

For those looking for a workaround, I created a starter project that doesn't use this plugin until a fix is discovered.

https://github.com/jessetrippe/jekyll-tailwindcss-starter-kit

@mhanberg
Copy link
Owner

I think #32 should have fixed this. I can re-open if that's not the case.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

8 participants