diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml index 9ff3393..5fe3fd3 100644 --- a/.github/workflows/lint.yml +++ b/.github/workflows/lint.yml @@ -23,18 +23,17 @@ jobs: uses: actions/setup-node@v5 with: node-version: 22 - - - name: Enable Corepack - run: corepack enable + cache: npm + cache-dependency-path: frontend/package-lock.json - name: Install Node.js dependencies - run: yarn install --immutable + run: npm ci - name: Run ESLint - run: yarn lint + run: npm run lint - name: Run Prettier format check - run: yarn format + run: npm run format ruff: name: Ruff (backend) diff --git a/.gitignore b/.gitignore index 7b310fb..29e4eb1 100644 --- a/.gitignore +++ b/.gitignore @@ -111,17 +111,12 @@ backend/.venv/ # Bun lock file (Frontend) /frontend/bun.lockb -# Yarn (Frontend) -frontend/.pnp.* -frontend/.yarn/* -!frontend/.yarn/patches -!frontend/.yarn/plugins -!frontend/.yarn/releases -!frontend/.yarn/sdks -!frontend/.yarn/versions -# Uncomment the following lines if you want to ignore lock files (not generally recommended) -# package-lock.json -# yarn.lock +# Yarn / pnpm (Frontend) - we use npm; package-lock.json is the only lockfile +/frontend/.pnp.* +/frontend/.yarn/ +/frontend/.yarnrc.yml +/frontend/yarn.lock +/frontend/pnpm-lock.yaml # =============================== # IDE & Editor Settings diff --git a/README.md b/README.md index 7a626f4..f18a59c 100644 --- a/README.md +++ b/README.md @@ -8,37 +8,41 @@ Repository for HoagieHelp. #### Prerequisites -Before you begin, ensure you have [Yarn](https://yarnpkg.com/) installed. You can install Yarn using corepack following [this guide](https://yarnpkg.com/getting-started/install): +Before you begin, ensure you have [Node.js](https://nodejs.org/) 22 (version 22.9.0 or later) installed. npm comes bundled with Node.js, so no separate package manager is needed. You can check your versions with: ```bash -npm install -g corepack +node -v +npm -v ``` -You can set your yarn version to the latest version with: +#### Installation + +First, make sure you're in the frontend directory: ```bash -yarn set version stable +cd frontend ``` -If your yarn version isn't applied globally, you can install a global version of yarn with: +To install the necessary dependencies for this project, run: ```bash -corepack install --global yarn@4.10.3 +npm install ``` - -#### Installation - -First, make sure you're in the frontend directory: +To install the exact versions recorded in `package-lock.json` without modifying it (this is what CI does), run: ```bash -cd frontend +npm ci ``` -To install the necessary dependencies for this project, run: +When adding or removing a dependency, use `npm install ` or `npm uninstall ` and commit the updated `package.json` and `package-lock.json` together. Please don't use Yarn or pnpm in this project, since they create a separate lockfile that will drift out of sync. + +#### Environment Variables + +Copy the example environment file and fill in the values: ```bash -yarn +cp .env.local.example .env.local ``` #### Running the App @@ -46,7 +50,7 @@ yarn Once the dependencies are installed, you can start the development server by running: ```bash -yarn dev +npm run dev ``` The app will now be running locally, and you can view it in your browser at localhost:3000. @@ -56,13 +60,13 @@ The app will now be running locally, and you can view it in your browser at loca You can run `eslint` to find common errors and bugs in your code with: ```bash -yarn lint +npm run lint ``` To try to automatically fix these errors, run: ```bash -yarn lint:fix +npm run lint:fix ``` #### Formatting @@ -70,25 +74,108 @@ yarn lint:fix You can run `prettier` to check the styling of your code and ensure consistent formatting: ```bash -yarn format +npm run format ``` To automatically fix the formatting, run: ```bash -yarn format:fix +npm run format:fix ``` +#### Type Checking + +You can run the TypeScript compiler to check for type errors with: + +```bash +npm run type-check +``` + +#### Migrating from Yarn + +The frontend previously used Yarn. If you have an existing checkout that was set up with Yarn, follow these steps once after pulling the change that switched to npm: + +1. Go to the frontend directory: + + ```bash + cd frontend + ``` + +2. Close VS Code (or any editor running the ESLint extension) and stop any running dev server first. On Windows, these keep native files in `node_modules` locked, which makes deletion fail with an `EPERM` error. Then remove the old Yarn artifacts and your existing `node_modules`: + + ```bash + rm -rf node_modules .yarn .yarnrc.yml yarn.lock + ``` + + On Windows (PowerShell), use: + + ```powershell + Remove-Item -Recurse -Force node_modules, .yarn, .yarnrc.yml, yarn.lock -ErrorAction SilentlyContinue + ``` + +3. Reinstall dependencies with npm from the committed lockfile: + + ```bash + npm ci + ``` + +4. Use npm for all commands from now on: + + | Yarn | npm | + | ----------------------- | --------------------------- | + | `yarn` | `npm install` | + | `yarn install --immutable` | `npm ci` | + | `yarn add ` | `npm install ` | + | `yarn add -D ` | `npm install -D ` | + | `yarn remove ` | `npm uninstall ` | + | `yarn dev` / `yarn