create-next-app Not working due to folder permission

[devjiwonchoi]

Summary

Error Output

The application path is not writable, please check folder permissions and try again.
It is likely you do not have write permissions for this folder.

Related Next.js Source

next.js/packages/create-next-app/create-app.ts

Lines 127 to 135 in 9229f74

	if (!(await isWriteable(path.dirname(root)))) {
	console.error(
	'The application path is not writable, please check folder permissions and try again.'
	)
	console.error(
	'It is likely you do not have write permissions for this folder.'
	)
	process.exit(1)
	}

next.js/packages/create-next-app/helpers/is-writeable.ts

Lines 3 to 10 in 599cde8

	export async function isWriteable(directory: string): Promise<boolean> {
	try {
	await fs.promises.access(directory, (fs.constants || fs).W_OK)
	return true
	} catch (err) {
	return false
	}
	}

Attempts

• pnpm create next-app
• yarn create next-app
• npx create-next-app
• Reinstalled homebrew, pnpm
• chmod -R 777
• chown -R
• Tried fs.promises.access(process.cwd(), fs.constants.W_OK), confirmed returning no error

Note

It worked fine until I factory reset this Macbook, assuming node related config issue.

Additional information

- Hardware: Macbook Air M1 2020
- Software: OS X Ventura 13.5
- Node: v18.17.0
- Package Manager: `Homebrew 4.1.4` & `pnpm 8.6.12`

Example

No response

[devjiwonchoi]

This was caused by naming the project as @next/project-name, recommending to add this case on

next.js/packages/create-next-app/index.ts

Lines 205 to 215 in 599cde8

	const { valid, problems } = validateNpmName(projectName)
	if (!valid) {
	console.error(
	`Could not create a project called ${red(
	`"${projectName}"`
	)} because of npm naming restrictions:`
	)
	problems!.forEach((p) => console.error(` ${red(bold('*'))} ${p}`))
	process.exit(1)
	}

with error name can only contain URL-friendly characters, which occurs when naming the project starting with @.

Edit

The dependency validate-npm-package-name which Next.js is using passes @tag/name format.
There must be an additional escape before reaching the isWriteable function.

Edit2

It was expected behavior, since create-next-app allows project path in the What is your project named? field.
I still do think when asking for the project name, it should warn if the project name includes / for clarification.

[maxpsq]

I just noticed that also trying to create a new app in the current directory (.)no longer works for the very same reason. Just try
npx create-next-app .

According to some examples I found in some blogs, in the past it was possible.

[KHALIL965]

npx create-next-app created my project but pnmp command its throwing error of not have access of writable

[anacierdem]

Similarly npx create-next-app <path> doesn't work even for a simple path name without special characters.

[devjiwonchoi]

How does it not work? Could you provide steps to repro?