use type: module

t3-oss · Nov 18, 2023 · 15f47a7 · 15f47a7
1 parent cef18c6
commit 15f47a7
Show file tree

Hide file tree

Showing 47 changed files with 129 additions and 128 deletions.
diff --git a/cli/CHANGELOG.md b/cli/CHANGELOG.md
@@ -296,7 +296,7 @@
 
 ### Patch Changes
 
-- [#1189](https://github.com/t3-oss/create-t3-app/pull/1189) [`bf12635`](https://github.com/t3-oss/create-t3-app/commit/bf1263576866116a904f3d1fa741c5496a535cb9) Thanks [@p13lgst](https://github.com/p13lgst)! - fix: remove ts-ignores on env.mjs
+- [#1189](https://github.com/t3-oss/create-t3-app/pull/1189) [`bf12635`](https://github.com/t3-oss/create-t3-app/commit/bf1263576866116a904f3d1fa741c5496a535cb9) Thanks [@p13lgst](https://github.com/p13lgst)! - fix: remove ts-ignores on env.js
 
 ## 7.5.1
 

diff --git a/cli/src/helpers/createProject.ts b/cli/src/helpers/createProject.ts
@@ -57,8 +57,8 @@ export const createProject = async ({
   if (appRouter) {
     // Replace next.config
     fs.copyFileSync(
-      path.join(PKG_ROOT, "template/extras/config/next-config-appdir.mjs"),
-      path.join(projectDir, "next.config.mjs")
+      path.join(PKG_ROOT, "template/extras/config/next-config-appdir.js"),
+      path.join(projectDir, "next.config.js")
     );
 
     selectLayoutFile({ projectDir, packages });

diff --git a/cli/src/installers/envVars.ts b/cli/src/installers/envVars.ts
@@ -15,11 +15,11 @@ export const envVariablesInstaller: Installer = ({ projectDir, packages }) => {
 
   const envFile =
     usingAuth && usingDb
-      ? "with-auth-db.mjs"
+      ? "with-auth-db.js"
       : usingAuth
-      ? "with-auth.mjs"
+      ? "with-auth.js"
       : usingDb
-      ? "with-db.mjs"
+      ? "with-db.js"
       : "";
 
   if (envFile !== "") {
@@ -28,7 +28,7 @@ export const envVariablesInstaller: Installer = ({ projectDir, packages }) => {
       "template/extras/src/env",
       envFile
     );
-    const envSchemaDest = path.join(projectDir, "src/env.mjs");
+    const envSchemaDest = path.join(projectDir, "src/env.js");
     fs.copySync(envSchemaSrc, envSchemaDest);
   }
 
@@ -45,7 +45,7 @@ const getEnvContent = (
   usingDrizzle: boolean
 ) => {
   let content = `
-# When adding additional environment variables, the schema in "/src/env.mjs"
+# When adding additional environment variables, the schema in "/src/env.js"
 # should be updated accordingly.
 `
     .trim()

diff --git a/cli/src/installers/tailwind.ts b/cli/src/installers/tailwind.ts
@@ -26,8 +26,8 @@ export const tailwindInstaller: Installer = ({ projectDir }) => {
   const postcssCfgSrc = path.join(extrasDir, "config/postcss.config.cjs");
   const postcssCfgDest = path.join(projectDir, "postcss.config.cjs");
 
-  const prettierSrc = path.join(extrasDir, "config/_prettier.config.mjs");
-  const prettierDest = path.join(projectDir, "prettier.config.mjs");
+  const prettierSrc = path.join(extrasDir, "config/_prettier.config.js");
+  const prettierDest = path.join(projectDir, "prettier.config.js");
 
   const cssSrc = path.join(extrasDir, "src/styles/globals.css");
   const cssDest = path.join(projectDir, "src/styles/globals.css");

diff --git a/cli/template/base/_eslintrc.cjs → cli/template/base/_eslintrc.js b/cli/template/base/_eslintrc.cjs → cli/template/base/_eslintrc.js
diff --git a/cli/template/base/next.config.mjs → cli/template/base/next.config.js b/cli/template/base/next.config.mjs → cli/template/base/next.config.js
@@ -2,7 +2,7 @@
  * Run `build` or `dev` with `SKIP_ENV_VALIDATION` to skip env validation. This is especially useful
  * for Docker builds.
  */
-await import("./src/env.mjs");
+await import("./src/env.js");
 
 /** @type {import("next").NextConfig} */
 const config = {

diff --git a/cli/template/base/package.json b/cli/template/base/package.json
@@ -1,6 +1,7 @@
 {
   "name": "template",
   "version": "0.1.0",
+  "type": "module",
   "private": true,
   "scripts": {
     "dev": "next dev",

diff --git a/cli/template/base/src/env.mjs → cli/template/base/src/env.js b/cli/template/base/src/env.mjs → cli/template/base/src/env.js
@@ -28,13 +28,13 @@ export const env = createEnv({
     // NEXT_PUBLIC_CLIENTVAR: process.env.NEXT_PUBLIC_CLIENTVAR,
   },
   /**
-   * Run `build` or `dev` with `SKIP_ENV_VALIDATION` to skip env validation.
-   * This is especially useful for Docker builds.
+   * Run `build` or `dev` with `SKIP_ENV_VALIDATION` to skip env validation. This is especially
+   * useful for Docker builds.
    */
   skipValidation: !!process.env.SKIP_ENV_VALIDATION,
   /**
-   * Makes it so that empty strings are treated as undefined.
-   * `SOME_VAR: z.string()` and `SOME_VAR=''` will throw an error.
+   * Makes it so that empty strings are treated as undefined. `SOME_VAR: z.string()` and
+   * `SOME_VAR=''` will throw an error.
    */
   emptyStringAsUndefined: true,
 });
diff --git a/...mplate/extras/config/_prettier.config.mjs → ...emplate/extras/config/_prettier.config.js b/...mplate/extras/config/_prettier.config.mjs → ...emplate/extras/config/_prettier.config.js
diff --git a/cli/template/extras/config/drizzle.config.ts b/cli/template/extras/config/drizzle.config.ts
@@ -1,6 +1,6 @@
 import { type Config } from "drizzle-kit";
 
-import { env } from "~/env.mjs";
+import { env } from "~/env";
 
 export default {
   schema: "./src/server/db/schema.ts",

diff --git a/...late/extras/config/next-config-appdir.mjs → ...plate/extras/config/next-config-appdir.js b/...late/extras/config/next-config-appdir.mjs → ...plate/extras/config/next-config-appdir.js
@@ -2,7 +2,7 @@
  * Run `build` or `dev` with `SKIP_ENV_VALIDATION` to skip env validation. This is especially useful
  * for Docker builds.
  */
-await import("./src/env.mjs");
+await import("./src/env.js");
 
 /** @type {import("next").NextConfig} */
 const config = {};

diff --git a/cli/template/extras/src/app/api/trpc/[trpc]/route.ts b/cli/template/extras/src/app/api/trpc/[trpc]/route.ts
@@ -1,7 +1,7 @@
 import { fetchRequestHandler } from "@trpc/server/adapters/fetch";
 import { type NextRequest } from "next/server";
 
-import { env } from "~/env.mjs";
+import { env } from "~/env";
 import { appRouter } from "~/server/api/root";
 import { createTRPCContext } from "~/server/api/trpc";
 

diff --git a/cli/template/extras/src/env/with-auth-db.mjs → cli/template/extras/src/env/with-auth-db.js b/cli/template/extras/src/env/with-auth-db.mjs → cli/template/extras/src/env/with-auth-db.js
diff --git a/cli/template/extras/src/env/with-auth.mjs → cli/template/extras/src/env/with-auth.js b/cli/template/extras/src/env/with-auth.mjs → cli/template/extras/src/env/with-auth.js
diff --git a/cli/template/extras/src/env/with-db.mjs → cli/template/extras/src/env/with-db.js b/cli/template/extras/src/env/with-db.mjs → cli/template/extras/src/env/with-db.js
diff --git a/cli/template/extras/src/pages/api/trpc/[trpc].ts b/cli/template/extras/src/pages/api/trpc/[trpc].ts
@@ -1,6 +1,6 @@
 import { createNextApiHandler } from "@trpc/server/adapters/next";
 
-import { env } from "~/env.mjs";
+import { env } from "~/env";
 import { appRouter } from "~/server/api/root";
 import { createTRPCContext } from "~/server/api/trpc";
 

diff --git a/cli/template/extras/src/server/auth-app/base.ts b/cli/template/extras/src/server/auth-app/base.ts
@@ -5,7 +5,7 @@ import {
 } from "next-auth";
 import DiscordProvider from "next-auth/providers/discord";
 
-import { env } from "~/env.mjs";
+import { env } from "~/env";
 
 /**
  * Module augmentation for `next-auth` types. Allows us to add custom properties to the `session`

diff --git a/cli/template/extras/src/server/auth-app/with-drizzle.ts b/cli/template/extras/src/server/auth-app/with-drizzle.ts
@@ -6,7 +6,7 @@ import {
 } from "next-auth";
 import DiscordProvider from "next-auth/providers/discord";
 
-import { env } from "~/env.mjs";
+import { env } from "~/env";
 import { db } from "~/server/db";
 import { mysqlTable } from "~/server/db/schema";
 

diff --git a/cli/template/extras/src/server/auth-app/with-prisma.ts b/cli/template/extras/src/server/auth-app/with-prisma.ts
@@ -6,7 +6,7 @@ import {
 } from "next-auth";
 import DiscordProvider from "next-auth/providers/discord";
 
-import { env } from "~/env.mjs";
+import { env } from "~/env";
 import { db } from "~/server/db";
 
 /**

diff --git a/cli/template/extras/src/server/auth-pages/base.ts b/cli/template/extras/src/server/auth-pages/base.ts
@@ -6,7 +6,7 @@ import {
 } from "next-auth";
 import DiscordProvider from "next-auth/providers/discord";
 
-import { env } from "~/env.mjs";
+import { env } from "~/env";
 
 /**
  * Module augmentation for `next-auth` types. Allows us to add custom properties to the `session`

diff --git a/cli/template/extras/src/server/auth-pages/with-drizzle.ts b/cli/template/extras/src/server/auth-pages/with-drizzle.ts
@@ -7,7 +7,7 @@ import {
 } from "next-auth";
 import DiscordProvider from "next-auth/providers/discord";
 
-import { env } from "~/env.mjs";
+import { env } from "~/env";
 import { db } from "~/server/db";
 import { mysqlTable } from "~/server/db/schema";
 

diff --git a/cli/template/extras/src/server/auth-pages/with-prisma.ts b/cli/template/extras/src/server/auth-pages/with-prisma.ts
@@ -7,7 +7,7 @@ import {
 } from "next-auth";
 import DiscordProvider from "next-auth/providers/discord";
 
-import { env } from "~/env.mjs";
+import { env } from "~/env";
 import { db } from "~/server/db";
 
 /**

diff --git a/cli/template/extras/src/server/db/db-prisma.ts b/cli/template/extras/src/server/db/db-prisma.ts
@@ -1,6 +1,6 @@
 import { PrismaClient } from "@prisma/client";
 
-import { env } from "~/env.mjs";
+import { env } from "~/env";
 
 const globalForPrisma = globalThis as unknown as {
   prisma: PrismaClient | undefined;

diff --git a/cli/template/extras/src/server/db/index-drizzle.ts b/cli/template/extras/src/server/db/index-drizzle.ts
@@ -1,7 +1,7 @@
 import { Client } from "@planetscale/database";
 import { drizzle } from "drizzle-orm/planetscale-serverless";
 
-import { env } from "~/env.mjs";
+import { env } from "~/env";
 import * as schema from "./schema";
 
 export const db = drizzle(

diff --git a/upgrade/next.config.mjs b/upgrade/next.config.mjs
@@ -6,7 +6,7 @@ import { getHighlighter } from "shiki";
  * Run `build` or `dev` with `SKIP_ENV_VALIDATION` to skip env validation. This is especially useful
  * for Docker builds.
  */
-await import("./src/env.mjs");
+await import("./src/env.js");
 
 /** @type {import('next').NextConfig} */
 const nextConfig = {

diff --git a/upgrade/src/lib/utils.ts b/upgrade/src/lib/utils.ts
@@ -2,7 +2,7 @@ import { request } from "@octokit/request";
 import { clsx, type ClassValue } from "clsx";
 import { twMerge } from "tailwind-merge";
 
-import { env } from "~/env.mjs";
+import { env } from "~/env";
 
 export const cn = (...inputs: ClassValue[]) => {
   return twMerge(clsx(inputs));

diff --git a/www/src/components/docs/folderStructureDiagram.astro b/www/src/components/docs/folderStructureDiagram.astro
@@ -15,7 +15,7 @@
   const allFiles = {
     "public/favicon.ico": [], // This file is included in every configuration
     "prisma/schema.prisma": ["prisma"], // This file is included with prisma
-    "src/env.mjs": [],
+    "src/env.js": [],
     "src/pages/_app.tsx": [],
     "src/pages/api/auth/[...nextauth].ts": ["nextauth"],
     "src/pages/api/trpc/[trpc].ts": ["trpc"],
@@ -32,10 +32,10 @@
     ".eslintrc.cjs": [],
     ".gitignore": [],
     "next-env.d.ts": [],
-    "next.config.mjs": [],
+    "next.config.js": [],
     "package.json": [],
     "postcss.config.cjs": ["tailwind"],
-    "prettier.config.mjs": ["tailwind"],
+    "prettier.config.js": ["tailwind"],
     "README.md": [],
     "tailwind.config.ts": ["tailwind"],
     "tsconfig.json": [],

diff --git a/www/src/pages/ar/deployment/docker.md b/www/src/pages/ar/deployment/docker.md
@@ -20,7 +20,7 @@ dir: rtl
 
 ### 1. إعداد Next
 
-في ملف [`next.config.mjs`](https://github.com/t3-oss/create-t3-app/blob/main/cli/template/base/next.config.mjs) قم بإضافة `standalone` حتى [تُقلل حجم الصور تلقائيا](https://nextjs.org/docs/advanced-features/output-file-tracing):
+في ملف [`next.config.js`](https://github.com/t3-oss/create-t3-app/blob/main/cli/template/base/next.config.js) قم بإضافة `standalone` حتى [تُقلل حجم الصور تلقائيا](https://nextjs.org/docs/advanced-features/output-file-tracing):
 
 ```diff
 export default defineNextConfig({
@@ -115,7 +115,7 @@ ENV NODE_ENV production
 RUN addgroup --system --gid 1001 nodejs
 RUN adduser --system --uid 1001 nextjs
 
-COPY --from=builder /app/next.config.mjs ./
+COPY --from=builder /app/next.config.js ./
 COPY --from=builder /app/public ./public
 COPY --from=builder /app/package.json ./package.json
 

diff --git a/www/src/pages/ar/folder-structure.mdx b/www/src/pages/ar/folder-structure.mdx
@@ -191,9 +191,9 @@ import Form from "../../components/docs/folderStructureForm.astro";
 </div>
 <div>
 
-### `next.config.mjs`
+### `next.config.js`
 
-يستخدم ملف `next.config.mjs` لإعداد Next.js، لمزيد من المعلومات [Next.js Docs](https://nextjs.org/docs/api-reference/next.config.js/introduction). تلميح: يسمح تمديد `.mjx` باستخدام ESM imports.
+يستخدم ملف `next.config.js` لإعداد Next.js، لمزيد من المعلومات [Next.js Docs](https://nextjs.org/docs/api-reference/next.config.js/introduction). تلميح: يسمح تمديد `.mjx` باستخدام ESM imports.
 
 </div>
 <div data-components="tailwind">
@@ -205,9 +205,9 @@ import Form from "../../components/docs/folderStructureForm.astro";
 </div>
 <div data-components="tailwind">
 
-### `prettier.config.mjs`
+### `prettier.config.js`
 
-إن ملف `prettier.config.mjs` ضروري عند استخدام Prettier ولإضافة prettier-plugin-tailwindcss لتنظيم الفئات (classes) مع Tailwind CSS، لمزيد من المعلومات [Tailwind CSS blog post](https://tailwindcss.com/blog/automatic-class-sorting-with-prettier).
+إن ملف `prettier.config.js` ضروري عند استخدام Prettier ولإضافة prettier-plugin-tailwindcss لتنظيم الفئات (classes) مع Tailwind CSS، لمزيد من المعلومات [Tailwind CSS blog post](https://tailwindcss.com/blog/automatic-class-sorting-with-prettier).
 
 </div>
 <div>

diff --git a/www/src/pages/ar/usage/env-variables.md b/www/src/pages/ar/usage/env-variables.md
@@ -71,10 +71,10 @@ const validated = schema.parse(process.env);
 
 ## إستخدام الـ Environment Variables
 
-إذا أردت إستخدام الـ env vars فيمكنك إستيراد` env.mjs` واستعمالهم طبيعيا. إذا إستيرادت الملف في Client وحولت استعمال قيم الserver-side، ستنذر بوجود خطأ في run-time.
+إذا أردت إستخدام الـ env vars فيمكنك إستيراد` env.js` واستعمالهم طبيعيا. إذا إستيرادت الملف في Client وحولت استعمال قيم الserver-side، ستنذر بوجود خطأ في run-time.
 
 ```ts:pages/api/hello.ts
-import { env } from "../../env.mjs";
+import { env } from "../../env.js";
 
 // `env` is fully typesafe and provides autocompletion
 const dbUrl = env.DATABASE_URL;

diff --git a/www/src/pages/en/deployment/docker.md b/www/src/pages/en/deployment/docker.md
@@ -16,7 +16,7 @@ Please note that Next.js requires a different process for build time (available
 
 ### 1. Next Configuration
 
-In your [`next.config.mjs`](https://github.com/t3-oss/create-t3-app/blob/main/cli/template/base/next.config.mjs), add the `standalone` output-option configuration to [reduce image size by automatically leveraging output traces](https://nextjs.org/docs/advanced-features/output-file-tracing):
+In your [`next.config.js`](https://github.com/t3-oss/create-t3-app/blob/main/cli/template/base/next.config.js), add the `standalone` output-option configuration to [reduce image size by automatically leveraging output traces](https://nextjs.org/docs/advanced-features/output-file-tracing):
 
 ```diff
 export default defineNextConfig({
@@ -108,7 +108,7 @@ ENV NODE_ENV production
 
 # ENV NEXT_TELEMETRY_DISABLED 1
 
-COPY --from=builder /app/next.config.mjs ./
+COPY --from=builder /app/next.config.js ./
 COPY --from=builder /app/public ./public
 COPY --from=builder /app/package.json ./package.json
 

diff --git a/www/src/pages/en/usage/env-variables.mdx b/www/src/pages/en/usage/env-variables.mdx
@@ -8,13 +8,13 @@ isMdx: true
 
 import Callout from "../../../components/docs/callout.tsx";
 
-Create T3 App uses its own package [@t3-oss/env-nextjs](https://env.t3.gg) along with [zod](https://zod.dev) under the hood for validating environment variables at runtime _and_ buildtime by providing a simple logic in `src/env.mjs`.
+Create T3 App uses its own package [@t3-oss/env-nextjs](https://env.t3.gg) along with [zod](https://zod.dev) under the hood for validating environment variables at runtime _and_ buildtime by providing a simple logic in `src/env.js`.
 
-## env.mjs
+## env.js
 
-_TLDR; If you want to add a new environment variable, you must add a validator for it in `src/env.mjs`, and then add the KV-pair in `.env`_
+_TLDR; If you want to add a new environment variable, you must add a validator for it in `src/env.js`, and then add the KV-pair in `.env`_
 
-```ts:env.mjs
+```ts:env.js
 import { createEnv } from "@t3-oss/env-nextjs";
 import { z } from "zod";
 
@@ -40,17 +40,17 @@ T3 Env uses the `createEnv` function to create the schema validate both client a
 
 ## Using Environment Variables
 
-When you want to use your environment variables, you can import them from the created `env.mjs` and use them as you would normally do. If you import this on the client and try accessing a server-side environment variable, you will get a runtime error.
+When you want to use your environment variables, you can import them from the created `env.js` and use them as you would normally do. If you import this on the client and try accessing a server-side environment variable, you will get a runtime error.
 
 ```ts:pages/api/hello.ts
-import { env } from "../../env.mjs";
+import { env } from "../../env.js";
 
 // `env` is fully typesafe and provides autocompletion
 const dbUrl = env.DATABASE_URL;
 ```
 
 ```ts:pages/index.tsx
-import { env } from "../env.mjs";
+import { env } from "../env.js";
 
 // ❌ This will throw a runtime error
 const dbUrl = env.DATABASE_URL;
@@ -71,7 +71,7 @@ To ensure your build never completes without the environment variables the proje
 
 📄 `.env`: Enter your environment variable like you would normally do in a `.env` file, i.e. `KEY=VALUE`
 
-📄 `env.mjs`: Add the appropriate validation logic for the environment variables by defining a Zod schema inside `createEnv` for each one, e.g. `KEY: z.string()`. Besides that, make sure to destruct them in the `runtimeEnv` option, e.g.: `KEY: process.env.KEY`
+📄 `env.js`: Add the appropriate validation logic for the environment variables by defining a Zod schema inside `createEnv` for each one, e.g. `KEY: z.string()`. Besides that, make sure to destruct them in the `runtimeEnv` option, e.g.: `KEY: process.env.KEY`
 
 <Callout type="info">
   Why do I need to destructure the environment variable in the `runtimeEnv`?
@@ -94,7 +94,7 @@ _I want to add my Twitter API Token as a server-side environment variable_
 TWITTER_API_TOKEN=1234567890
 ```
 
-2. Add the environment variable to `env.mjs`:
+2. Add the environment variable to `env.js`:
 
 ```ts
 import { createEnv } from "@t3-oss/env-nextjs";
@@ -129,7 +129,7 @@ SOME_NUMBER=123
 SOME_BOOLEAN=true
 ```
 
-Then, validate them in `env.mjs`:
+Then, validate them in `env.js`:
 
 ```ts
 import { createEnv } from "@t3-oss/env-nextjs";