Remix Prisma Seedを定義する

## 概要

RemixにてPrismaを使ってSQLiteのDBにseedを使ってレコードを追加する方法を簡単にまとめる。

## 前提

下記の構造のusersテーブルに10件の情報を追加する。

```schema.prisma
model users {
  id    Int     @id @default(autoincrement())
  email String  @unique
  name  String
}
```

## 方法

1. `プロジェクトルート/prisma/`直下にseed.tsというファイルを作成
1. seed.tsを下記のように記載

    ```seed.ts
    import { PrismaClient } from '@prisma/client';
    
    const prisma = new PrismaClient();
    
    async function main() {
      const users = [
        { email: 'user1@example.com', name: 'Alice' },
        { email: 'user2@example.com', name: 'Bob' },
        { email: 'user3@example.com', name: 'Charlie' },
        { email: 'user4@example.com', name: 'David' },
        { email: 'user5@example.com', name: 'Eve' },
        { email: 'user6@example.com', name: 'Frank' },
        { email: 'user7@example.com', name: 'Grace' },
        { email: 'user8@example.com', name: 'Helen' },
        { email: 'user9@example.com', name: 'Isaac' },
        { email: 'user10@example.com', name: 'Judy' }
      ];
  
      for (const user of users) {
        await prisma.users.create({
          data: user
        });
      }
    }
    
    main()
      .catch((e) => {
        console.error(e);
        process.exit(1);
      })
      .finally(async () => {
        await prisma.$disconnect();
      });
    ```

1. 下記を実行して必要パッケージをインストール

    ```shell
    npm install ts-node
    ```

1. package.jsonに下記の内容を追記

    - 追記内容

        ```package.json
        {
            "prisma": {
              "seed": "node --loader ts-node/esm prisma/seed.ts"
            }
        }
        ```

    - 追記後のpackage.jsonの全体

        ```package.json
        {
          "name": "todo",
          "private": true,
          "sideEffects": false,
          "type": "module",
          "scripts": {
            "build": "remix vite:build",
            "dev": "remix vite:dev",
            "lint": "eslint --ignore-path .gitignore --cache --cache-location ./node_modules/.cache/eslint .",
            "start": "remix-serve ./build/server/index.js",
            "typecheck": "tsc"
          },
          "dependencies": {
            "@prisma/client": "^5.14.0",
            "@remix-run/node": "^2.9.2",
            "@remix-run/react": "^2.9.2",
            "@remix-run/serve": "^2.9.2",
            "isbot": "^4.1.0",
            "prisma": "^5.14.0",
            "react": "^18.2.0",
            "react-dom": "^18.2.0",
            "ts-node": "^10.9.2"
          },
          "devDependencies": {
            "@remix-run/dev": "^2.9.2",
            "@types/react": "^18.2.20",
            "@types/react-dom": "^18.2.7",
            "@typescript-eslint/eslint-plugin": "^6.7.4",
            "@typescript-eslint/parser": "^6.7.4",
            "eslint": "^8.38.0",
            "eslint-import-resolver-typescript": "^3.6.1",
            "eslint-plugin-import": "^2.28.1",
            "eslint-plugin-jsx-a11y": "^6.7.1",
            "eslint-plugin-react": "^7.33.2",
            "eslint-plugin-react-hooks": "^4.6.0",
            "typescript": "^5.1.6",
            "vite": "^5.1.0",
            "vite-tsconfig-paths": "^4.2.1"
          },
          "engines": {
            "node": ">=20.0.0"
          },
          "prisma": {
            "seed": "node --loader ts-node/esm prisma/seed.ts"
          }
        }
        ```


1. 下記コマンドを実行してseedを実行

    ```shell
    npx prisma db seed
    ```

1.「🌱  The seed command has been executed.」のように出たらseedの実行完了