chore(deps): update remix monorepo to v1.16.0

This PR contains the following updates:

Package	Change	Age	Adoption	Passing	Confidence
@remix-run/dev (source)	`1.14.3` -> `1.16.0`
@remix-run/eslint-config	`1.14.3` -> `1.16.0`
@remix-run/netlify	`1.14.3` -> `1.16.0`
@remix-run/node	`1.14.3` -> `1.16.0`
@remix-run/react	`1.14.3` -> `1.16.0`
@remix-run/serve	`1.14.3` -> `1.16.0`

Release Notes

remix-run/remix (@remix-run/dev)

### [`v1.16.0`](https://togithub.com/remix-run/remix/blob/HEAD/packages/remix-dev/CHANGELOG.md#1160) [Compare Source](https://togithub.com/remix-run/remix/compare/@remix-run/dev@1.15.0...@remix-run/dev@1.16.0) ##### Minor Changes - Enable support for [CSS Modules](https://togithub.com/css-modules/css-modules), [Vanilla Extract](http://vanilla-extract.style) and CSS side-effect imports ([#6046](https://togithub.com/remix-run/remix/pull/6046)) These CSS bundling features were previously only available via `future.unstable_cssModules`, `future.unstable_vanillaExtract` and `future.unstable_cssSideEffectImports` options in `remix.config.js`, but they have now been stabilized. In order to use these features, check out our guide to [CSS bundling](https://remix.run/docs/en/1.16.0/guides/styling#css-bundling) in your project. - Stabilize built-in PostCSS support via the new `postcss` option in `remix.config.js`. As a result, the `future.unstable_postcss` option has also been deprecated. ([#5960](https://togithub.com/remix-run/remix/pull/5960)) The `postcss` option is `false` by default, but when set to `true` will enable processing of all CSS files using PostCSS if `postcss.config.js` is present. If you followed the original PostCSS setup guide for Remix, you may have a folder structure that looks like this, separating your source files from its processed output: . ├── app │ └── styles (processed files) │ ├── app.css │ └── routes │ └── index.css └── styles (source files) ├── app.css └── routes └── index.css After you've enabled the new `postcss` option, you can delete the processed files from `app/styles` folder and move your source files from `styles` to `app/styles`: . ├── app │ └── styles (source files) │ ├── app.css │ └── routes │ └── index.css You should then remove `app/styles` from your `.gitignore` file since it now contains source files rather than processed output. You can then update your `package.json` scripts to remove any usage of `postcss` since Remix handles this automatically. For example, if you had followed the original setup guide: ```diff { "scripts": { - "dev:css": "postcss styles --base styles --dir app/styles -w", - "build:css": "postcss styles --base styles --dir app/styles --env production", - "dev": "concurrently \"npm run dev:css\" \"remix dev\"" + "dev": "remix dev" } } ``` - Stabilize built-in Tailwind support via the new `tailwind` option in `remix.config.js`. As a result, the `future.unstable_tailwind` option has also been deprecated. ([#5960](https://togithub.com/remix-run/remix/pull/5960)) The `tailwind` option is `false` by default, but when set to `true` will enable built-in support for Tailwind functions and directives in your CSS files if `tailwindcss` is installed. If you followed the original Tailwind setup guide for Remix and want to make use of this feature, you should first delete the generated `app/tailwind.css`. Then, if you have a `styles/tailwind.css` file, you should move it to `app/tailwind.css`. ```sh rm app/tailwind.css mv styles/tailwind.css app/tailwind.css ``` Otherwise, if you don't already have an `app/tailwind.css` file, you should create one with the following contents: ```css @tailwind base; @tailwind components; @tailwind utilities; ``` You should then remove `/app/tailwind.css` from your `.gitignore` file since it now contains source code rather than processed output. You can then update your `package.json` scripts to remove any usage of `tailwindcss` since Remix handles this automatically. For example, if you had followed the original setup guide: ```diff { // ... "scripts": { - "build": "run-s \"build:*\"", + "build": "remix build", - "build:css": "npm run generate:css -- --minify", - "build:remix": "remix build", - "dev": "run-p \"dev:*\"", + "dev": "remix dev", - "dev:css": "npm run generate:css -- --watch", - "dev:remix": "remix dev", - "generate:css": "npx tailwindcss -o ./app/tailwind.css", "start": "remix-serve build" } // ... } ``` - The Remix dev server spins up your app server as a managed subprocess. ([#6133](https://togithub.com/remix-run/remix/pull/6133)) This keeps your development environment as close to production as possible. It also means that the Remix dev server is compatible with *any* app server. By default, the dev server will use the Remix App Server, but you opt to use your own app server by specifying the command to run it via the `-c`/`--command` flag: ```sh remix dev # uses `remix-serve ` as the app server remix dev -c "node ./server.js" # uses your custom app server at `./server.js` ``` The dev server will: - force `NODE_ENV=development` and warn you if it was previously set to something else - rebuild your app whenever your Remix app code changes - restart your app server whenever rebuilds succeed - handle live reload and HMR + Hot Data Revalidation ##### App server coordination In order to manage your app server, the dev server needs to be told what server build is currently being used by your app server. This works by having the app server send a "I'm ready!" message with the Remix server build hash as the payload. This is handled automatically in Remix App Server and is set up for you via calls to `broadcastDevReady` or `logDevReady` in the official Remix templates. If you are not using Remix App Server and your server doesn't call `broadcastDevReady`, you'll need to call it in your app server *after* it is up and running. For example, in an Express server: ```js // server.js // import { broadcastDevReady } from "@remix-run/node"; // Path to Remix's server build directory ('build/' by default) const BUILD_DIR = path.join(process.cwd(), "build"); //



app.listen(3000, () => {
  const build = require(BUILD_DIR);
  console.log("Ready: http://localhost:" + port);

  // in development, call `broadcastDevReady` _after_ your server is up and running
  if (process.env.NODE_ENV === "development") {
    broadcastDevReady(build);
  }
});
```

##### Options

Options priority order is: 1. flags, 2. config, 3. defaults.

| Option         | flag               | config           | default                           |
| -------------- | ------------------ | ---------------- | --------------------------------- |
| Command        | `-c` / `--command` | `command`        | `remix-serve ` |
| HTTP(S) scheme | `--http-scheme`    | `httpScheme`     | `http`                            |
| HTTP(S) host   | `--http-host`      | `httpHost`       | `localhost`                       |
| HTTP(S) port   | `--http-port`      | `httpPort`       | Dynamically chosen open port      |
| Websocket port | `--websocket-port` | `websocketPort`  | Dynamically chosen open port      |
| No restart     | `--no-restart`     | `restart: false` | `restart: true`                   |

🚨 The `--http-*` flags are only used for internal dev server <-> app server communication.
Your app will run on your app server's normal URL.

To set `unstable_dev` configuration, replace `unstable_dev: true` with `unstable_dev: {  }`.
For example, to set the HTTP(S) port statically:

```js
// remix.config.js
module.exports = {
  future: {
    unstable_dev: {
      httpPort: 8001,
    },
  },
};
```

##### SSL and custom hosts

You should only need to use the `--http-*` flags and `--websocket-port` flag if you need fine-grain control of what scheme/host/port for the dev server.
If you are setting up SSL or Docker networking, these are the flags you'll want to use.

🚨 Remix **will not** set up SSL and custom host for you.
The `--http-scheme` and `--http-host` flag are for you to tell Remix how you've set things up.
It is your task to set up SSL certificates and host files if you want those features.

##### `--no-restart` and `require` cache purging

If you want to manage server changes yourself, you can use the `--no-restart` flag to tell the dev server to refrain from restarting your app server when builds succeed:

```sh
remix dev -c "node ./server.js" --no-restart
```

For example, you could purge the `require` cache of your app server to keep it running while picking up server changes.
If you do so, you should watch the server build path (`build/` by default) for changes and only purge the `require` cache when changes are detected.

🚨 If you use `--no-restart`, it is your responsibility to call `broadcastDevReady` when your app server has picked up server changes.
For example, with `chokidar`:

```js
// server.dev.js
const BUILD_PATH = path.resolve(__dirname, "build");

const watcher = chokidar.watch(BUILD_PATH);

watcher.on("change", () => {
  // 1. purge require cache
  purgeRequireCache();
  // 2. load updated server build
  const build = require(BUILD_PATH);
  // 3. tell dev server that this app server is now ready
  broadcastDevReady(build);
});
```

##### Patch Changes

-   Fix absolute paths in CSS `url()` rules when using CSS Modules, Vanilla Extract and CSS side-effect imports ([#5788](https://togithub.com/remix-run/remix/pull/5788))
-   look for [@remix-run/serve](https://togithub.com/remix-run/serve) in `devDependencies` when running remix dev ([#6228](https://togithub.com/remix-run/remix/pull/6228))
-   add warning for v2 "cjs"->"esm" `serverModuleFormat` default change ([#6154](https://togithub.com/remix-run/remix/pull/6154))
-   write mjs server output files ([#6225](https://togithub.com/remix-run/remix/pull/6225))
-   fix(react,dev): dev chunking and refresh race condition ([#6201](https://togithub.com/remix-run/remix/pull/6201))
-   Use correct require context in `bareImports` plugin. ([#6181](https://togithub.com/remix-run/remix/pull/6181))
-   use minimatch for regex instead of glob-to-regexp ([#6017](https://togithub.com/remix-run/remix/pull/6017))
-   add `logDevReady` as replacement for platforms that can't initialize async I/O outside of the request response lifecycle. ([#6204](https://togithub.com/remix-run/remix/pull/6204))
-   Use the "automatic" JSX runtime when processing MDX files. ([#6098](https://togithub.com/remix-run/remix/pull/6098))
-   forcibly kill app server during dev ([#6197](https://togithub.com/remix-run/remix/pull/6197))
-   show first compilation error instead of cancelation errors ([#6202](https://togithub.com/remix-run/remix/pull/6202))
-   Resolve imports from route modules across the graph back to the virtual module created by the v2 routes plugin. This fixes issues where we would duplicate portions of route modules that were imported. ([#6098](https://togithub.com/remix-run/remix/pull/6098))
-   Updated dependencies:
    -   `@remix-run/server-runtime@1.16.0`

### [`v1.15.0`](https://togithub.com/remix-run/remix/blob/HEAD/packages/remix-dev/CHANGELOG.md#1150)

[Compare Source](https://togithub.com/remix-run/remix/compare/@remix-run/dev@1.14.3...@remix-run/dev@1.15.0)

##### Minor Changes

-   Added deprecation warning for `v2_normalizeFormMethod` ([#5863](https://togithub.com/remix-run/remix/pull/5863))

-   Added a new `future.v2_normalizeFormMethod` flag to normalize the exposed `useNavigation().formMethod` as an uppercase HTTP method to align with the previous `useTransition` behavior as well as the `fetch()` behavior of normalizing to uppercase HTTP methods. ([#5815](https://togithub.com/remix-run/remix/pull/5815))

    -   When `future.v2_normalizeFormMethod === false`,
        -   `useNavigation().formMethod` is lowercase
        -   `useFetcher().formMethod` is uppercase
    -   When `future.v2_normalizeFormMethod === true`:
        -   `useNavigation().formMethod` is uppercase
        -   `useFetcher().formMethod` is uppercase

-   Added deprecation warning for `browserBuildDirectory` in `remix.config` ([#5702](https://togithub.com/remix-run/remix/pull/5702))

-   Added deprecation warning for `CatchBoundary` in favor of `future.v2_errorBoundary` ([#5718](https://togithub.com/remix-run/remix/pull/5718))

-   Added experimental support for Vanilla Extract caching, which can be enabled by setting `future.unstable_vanillaExtract: { cache: true }` in `remix.config`. This is considered experimental due to the use of a brand new Vanilla Extract compiler under the hood. In order to use this feature, you must be using at least `v1.10.0` of `@vanilla-extract/css`. ([#5735](https://togithub.com/remix-run/remix/pull/5735))

-   Added deprecation warning for `serverBuildDirectory` in `remix.config` ([#5704](https://togithub.com/remix-run/remix/pull/5704))

##### Patch Changes

-   Fixed issue to ensure changes to CSS inserted via `@remix-run/css-bundle` are picked up during HMR ([#5823](https://togithub.com/remix-run/remix/pull/5823))
-   We now use `path.resolve` when re-exporting `entry.client` ([#5707](https://togithub.com/remix-run/remix/pull/5707))
-   Added support for `.mjs` and `.cjs` extensions when detecting CSS side-effect imports ([#5564](https://togithub.com/remix-run/remix/pull/5564))
-   Fixed resolution issues for pnpm users installing `react-refresh` ([#5637](https://togithub.com/remix-run/remix/pull/5637))
-   Added deprecation warning for `future.v2_meta` ([#5878](https://togithub.com/remix-run/remix/pull/5878))
-   Added optional entry file support for React 17 ([#5681](https://togithub.com/remix-run/remix/pull/5681))
-   Updated dependencies:
    -   `@remix-run/server-runtime@1.15.0`



remix-run/remix (@remix-run/eslint-config)

### [`v1.16.0`](https://togithub.com/remix-run/remix/blob/HEAD/packages/remix-eslint-config/CHANGELOG.md#1160)

[Compare Source](https://togithub.com/remix-run/remix/compare/@remix-run/eslint-config@1.15.0...@remix-run/eslint-config@1.16.0)

##### Minor Changes

-   add deprecation warning to `@remix-run/eslint-config/jest` ESLint config ([#5697](https://togithub.com/remix-run/remix/pull/5697))

### [`v1.15.0`](https://togithub.com/remix-run/remix/blob/HEAD/packages/remix-eslint-config/CHANGELOG.md#1150)

[Compare Source](https://togithub.com/remix-run/remix/compare/@remix-run/eslint-config@1.14.3...@remix-run/eslint-config@1.15.0)

##### Patch Changes

-   Updated TypeScript `peerDependency` to allow for `^5.0.0` ([`6b6ee66a2`](https://togithub.com/remix-run/remix/commit/6b6ee66a2fef1a7b00ce4c95abed144ab80017e3))



remix-run/remix (@remix-run/netlify)

### [`v1.16.0`](https://togithub.com/remix-run/remix/blob/HEAD/packages/remix-netlify/CHANGELOG.md#1160)

[Compare Source](https://togithub.com/remix-run/remix/compare/@remix-run/netlify@1.15.0...@remix-run/netlify@1.16.0)

##### Patch Changes

-   feat: support async `getLoadContext` in all adapters ([#6170](https://togithub.com/remix-run/remix/pull/6170))
-   Updated dependencies:
    -   `@remix-run/node@1.16.0`

### [`v1.15.0`](https://togithub.com/remix-run/remix/blob/HEAD/packages/remix-netlify/CHANGELOG.md#1150)

[Compare Source](https://togithub.com/remix-run/remix/compare/@remix-run/netlify@1.14.3...@remix-run/netlify@1.15.0)

##### Patch Changes

-   Updated dependencies:
    -   `@remix-run/node@1.15.0`



remix-run/remix (@remix-run/node)

### [`v1.16.0`](https://togithub.com/remix-run/remix/blob/HEAD/packages/remix-node/CHANGELOG.md#1160)

[Compare Source](https://togithub.com/remix-run/remix/compare/@remix-run/node@1.15.0...@remix-run/node@1.16.0)

##### Patch Changes

-   add `@remix-run/node/install` side-effect to allow `node --require @remix-run/node/install` ([#6132](https://togithub.com/remix-run/remix/pull/6132))
-   add `logDevReady` as replacement for platforms that can't initialize async I/O outside of the request response lifecycle. ([#6204](https://togithub.com/remix-run/remix/pull/6204))
-   add missing files to published package ([#6179](https://togithub.com/remix-run/remix/pull/6179))
-   Updated dependencies:
    -   `@remix-run/server-runtime@1.16.0`

### [`v1.15.0`](https://togithub.com/remix-run/remix/blob/HEAD/packages/remix-node/CHANGELOG.md#1150)

[Compare Source](https://togithub.com/remix-run/remix/compare/@remix-run/node@1.14.3...@remix-run/node@1.15.0)

##### Minor Changes

-   We have made a few changes to the API for route module `meta` functions when using the `future.v2_meta` flag. **These changes are *only* breaking for users who have opted in.** ([#5746](https://togithub.com/remix-run/remix/pull/5746))

    -   `V2_HtmlMetaDescriptor` has been renamed to `V2_MetaDescriptor`
    -   The `meta` function's arguments have been simplified
        -   `parentsData` has been removed, as each route's loader data is available on the `data` property of its respective `match` object
            ```tsx
            // before
            export function meta({ parentsData }) {
              return [{ title: parentsData["routes/some-route"].title }];
            }
            // after
            export function meta({ matches }) {
              return [
                {
                  title: matches.find((match) => match.id === "routes/some-route")
                    .data.title,
                },
              ];
            }
            ```
        -   The `route` property on route matches has been removed, as relevant match data is attached directly to the match object
            ```tsx
            // before
            export function meta({ matches }) {
              const rootModule = matches.find((match) => match.route.id === "root");
            }
            // after
            export function meta({ matches }) {
              const rootModule = matches.find((match) => match.id === "root");
            }
            ```
    -   Added support for generating ` Githubissues.
            Githubissues is a development platform for aggregating issues.

netlify-templates / kpop-stack

chore(deps): update remix monorepo to v1.16.0 #174

Release Notes