creyD/prettier_action

[BUG] Cannot find module 'prettier-plugin-tailwindcss'

Opened this issue · 11 comments

The following workflow gives this error:

...
Installing prettier...
Checking plugin: prettier-plugin-tailwindcss
Checking plugin: @shopify/prettier-plugin-liquid
Prettifying files...
Files:
Error:  Cannot find module 'prettier-plugin-tailwindcss'
Error:  Require stack:
Error:  - /runner/_work/_actions/creyD/prettier_action/v4.2/node_modules/prettier/index.js
Error:  - /runner/_work/_actions/creyD/prettier_action/v4.2/node_modules/prettier/cli.js
Error:  - /runner/_work/_actions/creyD/prettier_action/v4.2/node_modules/prettier/bin-prettier.js
Problem running prettier with --write .
Error: Process completed with exit code 1.

Workflow

name: Format

on:
  push:
    branches:
      - main
  pull_request:

jobs:
  run-prettier:
    runs-on: self-hosted
    steps:
      - name: Checkout
        uses: actions/checkout@v3
        with:
          ref: ${{ github.head_ref }}
          fetch-depth: 0

      - name: Prettify code
        uses: creyD/prettier_action@v4.2
        with:
          prettier_plugins: "prettier-plugin-tailwindcss @shopify/prettier-plugin-liquid"
          prettier_options: --write .
          only_changed: True

.prettierrc.json

{
  "printWidth": 100,
  "singleQuote": true,
  "plugins": ["prettier-plugin-tailwindcss"],
  "overrides": [
    {
      "files": ["**/*.liquid"],
      "options": {
        "singleQuote": false
      }
    }
  ]
}

Not sure how to proceed.

@creyD What would be the ETA on having this bug resolved. My dev team's project uses your action as part of our build checks

creyD commented

@karkir0003 Can you please try with version 4.3?

It seems like using version 4.3 works @creyD. I'll keep you posted if another error comes up

creyD commented

Good, @andershagbard Please confirm that it works with 4.3 for you too.

Same error Cannot find module 'prettier-plugin-tailwindcss'

Feels like the problem is this:

if ! echo "$plugin" | grep -Eq '(@prettier\/plugin-|(@[a-z\-]+\/)?prettier-plugin-){1}([a-z\-]+)'; then
echo "$plugin does not seem to be a valid @prettier/plugin-x plugin. Exiting."
exit 1
fi

Feels like the problem is this:

if ! echo "$plugin" | grep -Eq '(@prettier\/plugin-|(@[a-z\-]+\/)?prettier-plugin-){1}([a-z\-]+)'; then
echo "$plugin does not seem to be a valid @prettier/plugin-x plugin. Exiting."
exit 1
fi

@timsu92 I don't think that's the issue. "prettier-plugin-tailwindcss" matches that regex, and that's not the error message being presented anyway.

I'm seeing the same issue with v4.3: 'Cannot find module 'prettier-plugin-organize-imports'.

Latest CI job results here.

Config:

name: Prettier

on:
  push:
    branches: [main]
  pull_request:
    branches: [main]

jobs:
  prettier:
    name: Prettier
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v3
        with:
          ref: ${{ github.event.pull_request.head.sha }}
      - name: Prettify code
        uses: creyD/prettier_action@v4.3
        with:
          dry: true
          prettier_options: --check *.{mj,t}s examples/**/* packages/*/src/** packages/*/dev/** packages/react-querybuilder/genericTests/** website/*.js website/{docs,src,versioned_docs,versioned_sidebars}/**
          prettier_plugins: 'prettier-plugin-organize-imports'
      - name: Git diff
        if: ${{ failure() }}
        run: git diff && exit 1
creyD commented

@jakeboone02 Any ideas on how to fix this?

@creyD I'm not sure if this will help, but I had a similar issue when trying to use Prettier's JavaScript API from Bun. The solution to that particular problem was to specify the location of the /node_modules directory with the pluginSearchDirs option (--plugin-search-dir on the command line). Seemed unnecessary but, like I said, it resolved the issue.

I was having this same issue with prettier_action v4.3 (and the config files shown below) and was able to work around it by adding an npm install step before calling the action to install the plugin to the runner rather than relying on the action to do it which seems to get it to work -- not sure if that helps with debugging this or helps anyone else work around it?

Here's my (now) working workflow file for reference

...
jobs:
  build-and-test:
    name: 'Build, Format and Test'
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v2

      - name: NPM Install
        run: npm i

      - name: Run Prettier
        if: ${{ github.ref != 'refs/heads/main' }}
        uses: creyD/prettier_action@master
        with:
          prettier_options: --write {**/*,*}.{js,jsx,mjs,cjs,ts,tsx,css,scss,sass}
          file_pattern: "src"
          prettier_plugins: "prettier-plugin-tailwindcss"

...

my .prettierrc.js

/** @type {import("prettier").Options} */
module.exports = {
  trailingComma: 'es5',
  tabWidth: 2,
  semi: true,
  singleQuote: true,
  jsxSingleQuote: true,
  plugins: ['prettier-plugin-tailwindcss'],
};

and my devDependencies

  "devDependencies": {
    "@typescript-eslint/eslint-plugin": "^5.62.0",
    "@typescript-eslint/parser": "^5.62.0",
    "eslint": "^8.47.0",
    "eslint-plugin-jest-dom": "^5.0.2",
    "eslint-plugin-react": "^7.33.2",
    "prettier": "^3.0.2",
    "prettier-plugin-tailwindcss": "^0.5.3",
    "tailwindcss": "^3.3.3"
  },
koppor commented

I can confirm

  1. This is not fixed with version 4.3
  2. The workaround with npm install prettier prettier-plugin-java --save-dev works.