Repository: create-react-app
Issue: CRA5 app fails to build due to Invalid mapping error in Css Minimizer plugin
Labels: needs triage,issue: bug report

### Describe the bug

(Originally reported as https://github.com/tailwindlabs/tailwindcss/issues/7687, but closed and moved to a discussion by @adamwathan, so I assume he believes the problem does not lie there.)

In a vanilla CRA 5 app configured with Tailwind 3, the project fails to build if a CSS rule using Tailwind's `@apply` directive together with a background color rule is included. Removing the background color from the custom selector avoids the problem.

UPDATE: @thecrypticace [has demonstrated](https://github.com/tailwindlabs/tailwindcss/discussions/7688#discussioncomment-2266946) that the issue is not dependent on Tailwind, but also occurs when using standard CSS.

### Did you try recovering your dependencies?

Yes

### Which terms did you search for in User Guide?

build, minify, css

### Environment

Environment Info:

  current version of create-react-app: 5.0.0
  running from /Users/stephen/.npm/_npx/c67e74de0542c87c/node_modules/create-react-app

  System:
    OS: macOS 12.1
    CPU: (10) x64 Apple M1 Pro
  Binaries:
    Node: 14.17.5 - /usr/local/bin/node
    Yarn: 1.22.11 - ~/.npm-global/bin/yarn
    npm: 8.5.2 - ~/.npm-global/bin/npm
  Browsers:
    Chrome: 98.0.4758.109
    Edge: Not Found
    Firefox: 96.0.3
    Safari: 15.2
  npmPackages:
    react: ^17.0.2 => 17.0.2 
    react-dom: ^17.0.2 => 17.0.2 
    react-scripts: 5.0.0 => 5.0.0 
  npmGlobalPackages:
    create-react-app: Not Found

### Steps to reproduce

Sample project to reproduce issue: https://github.com/stephent/cra-5-tw-3-build-fails

1. Download `main` branch of sample project
2. Install dependencies `npm i`
3. Run `npm run build`

### Expected behavior

Should build successfully 

### Actual behavior

Build fails with the following error:

```
Failed to compile.

static/css/main.4bacc579.css from Css Minimizer plugin
Error: Invalid mapping: {"generated":{"line":3,"column":8651},"source":"static/css/main.4bacc579.css","original":{"line":330,"column":null},"name":null}
```
### Reproducible demo

https://github.com/stephent/cra-5-tw-3-build-fails

1. Download source, install dependencies
2. Build project
3. Build fails as described above
4. The project includes a file `./styles/custom.css` with a single selector, `.my-class`. Edit line 2 and delete the applied rule `bg-white`
5. The project builds successfully

I tried a few different rules here and only managed to reproduce the build error when a background color rule was used.

I could not find any open bug reports against `css-minimizer-webpack-plugin` for 'Invalid mapping' errors, and given that CRA doesn't expose webpack config by default, I wonder if there's an issue with what gets passed in to the css minimizer.

(I did also try customizing the css minimizer config via craco to use different minification approaches, but they all fail in the same way, suggesting the problem may lie upstream of that step.)

See also 

- https://github.com/tailwindlabs/tailwindcss/discussions/7688#discussioncomment-2266946
- https://github.com/thecrypticace/cra-css-minimize-bug
- https://stackoverflow.com/questions/71156694/run-build-command-in-react-is-giving-me-error-invalid-mapping)