reactjs - כתב ספרות שגוי באות הכונן ב-Windows עם Yarn ו-NextJS


הקמתי היום פרויקט חדש באמצעות Yarn ו-NextJS על המחשב שלי Windows. בעת ההפעלה, אני מקבל שגיאה שהחיתוך (casing) אינו "תקין" עבור תיקיית הפרויקט שלי. ספציפית, אני רואה את השגיאות הבאות:

  • Invalid casing detected for project dir, received c:\super-amazing-project actual path C:\super-amazing-project
  • There are multiple modules with names that only differ in casing.

הדבר המפתיע הוא שבהודעת השגיאה שני הנתיבים זהים מלבד אות הכונן.

איך אני מתקן את זה?

גרסאות

  • גרסת Yarn 1.22.17
  • גרסת NextJS 12.1.5

פלט קונסולה

c:\super-amazing-project>yarn dev
yarn run v1.22.17
next dev
warn  - Invalid casing detected for project dir, received c:\super-amazing-project actual path C:\super-amazing-project, see more info here https://nextjs.org/docs/messages/invalid-project-dir-casing
ready - started server on 0.0.0.0:3000, url: http://localhost:3000

./node_modules/react/cjs/react.development.js
There are multiple modules with names that only differ in casing.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Use equal casing. Compare these module identifiers:
* C:\super-amazing-project\node_modules\react\cjs\react.development.js
    Used by 2 module(s), i. e.
    C:\super-amazing-project\node_modules\react\index.js
* c:\super-amazing-project\node_modules\react\cjs\react.development.js
    Used by 2 module(s), i. e.
    c:\super-amazing-project\node_modules\react\index.js

package.json

{
  "name": "super-amazing-project",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@chakra-ui/react": "^1.8.8",
    "@emotion/react": "11",
    "@emotion/styled": "11",
    "framer-motion": "6",
    "next": "12.1.5",
    "react": "18.0.0",
    "react-dom": "18.0.0",
    "react-icons": "^4.3.1"
  },
  "devDependencies": {
    "@types/node": "17.0.25",
    "@types/react": "18.0.6",
    "@types/react-dom": "18.0.2",
    "eslint": "8.13.0",
    "eslint-config-next": "12.1.5",
    "typescript": "4.6.3"
  }
}

תשובה #1

אתה כנראה שינית את האות של הכונן ב-Windows בטרמינל הפקודות על ידי שימוש בפקודה כמו cd c:\super-amazing-project ואז הקמת פרויקט עם אות כונן Windows באות קטנה. זה גורם לבעיות מוזרות כמו אלו שאתה חווה.

פתרון 1. שנה את האות של הכונן ונסה שוב yarn dev

אתה יכול לשנות את האות של הכונן בווינדוס באמצעות הפקודה cd כך

C:\super-amazing-project>cd c:\

c:\>cd super-amazing-project

c:\super-amazing-project> yarn dev

פתרון 2. הגדר מחדש את הפרויקט שלך באמצעות האות הגדולה המוגדרת של הכונן

התקנה עם אות כונן קטנה שאינה ברירת המחדל ב-Windows עשויה להציב את הפרויקט החדש שלך במצב גרוע. אם הפרויקט הזה חדש, ייתכן שיהיה קל יותר פשוט להריץ שוב את npx create-next-app ולהעתיק את קבצי הפרויקט שלך.