npx failing when running create-react-app-ts

[brucou]

Is this a bug report?

(write your answer here)
no

Environment

1. npm ls react-scripts-ts (if you haven’t ejected):

-- (empty)

2. node -v:
   v8.2.0

3. npm -v:
   v5.3.0

4. yarn --version (if you use Yarn):

5. npm ls react-scripts-ts (if you haven’t ejected):

Then, specify:

1. Operating system: windows 10
2. Browser and version (if relevant): Chrome latest

Steps to Reproduce

(Write your steps here:)

1. import directory : https://github.com/wmonk/create-react-app-typescript
2. run npm install
3. run npx create-react-app app

Expected Behavior

(Write what you thought would happen.)
well, an app should be created

Actual Behavior

(Write what happened. Please add screenshots!)

C:\Users\toshiba\WebstormProjects\create-react-app-typescript>npx create-react-app app
Command failed: C:\"Program Files"\nodejs\node.exe C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js config get cache --parseable
module.js:487
    throw err;
    ^

Error: Cannot find module 'C:\Program'
    at Function.Module._resolveFilename (module.js:485:15)
    at Function.Module._load (module.js:437:25)
    at Function.Module.runMain (module.js:605:10)
    at startup (bootstrap_node.js:158:16)
    at bootstrap_node.js:575:3

Command failed: C:\"Program Files"\nodejs\node.exe C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js config get cache --parseable
module.js:487
    throw err;
    ^

Error: Cannot find module 'C:\Program'
    at Function.Module._resolveFilename (module.js:485:15)
    at Function.Module._load (module.js:437:25)
    at Function.Module.runMain (module.js:605:10)
    at startup (bootstrap_node.js:158:16)
    at bootstrap_node.js:575:3

[brucou]

This is likely due to the path C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js having spaces, so it is incorrectly decoded. Does nobody use windows for development nowadays? or do I have a misconfigured windows?

[DorianGrey]

Does nobody use windows for development nowadays?

Suppose that the majority of developers don't use Windows as their primary development platform.

Regarding the issue:
There are a couple of issues mentioning that problem using npx or npm from or to a path that contains spaces, e.g.:
zkat/npx#146
zkat/npx#100
Some of the comments indicate that this might a problem of npm itself.

[brucou]

Thanks Dorian, this is helpful. Is there another way to run create-react-app than with npx? I could not find an eponym script or executable in bin

[brucou]

ok so the workaround recommended in one of those links is to globally install create-react-app as in npm install -g create-react-app. That almost worked for me. The issue now is difference in version for babel-jest which create-react-app creates and the one in create-react-app-typescript directory, but that is an entirely different issue, so the workaround seems valid.

[DorianGrey]

[...] The issue now is difference in version for babel-jest which create-react-app creates and the one in create-react-app-typescript directory [...]

The current version 2 of CRA uses Babel 7 and thus a more recent version of babel-jest. CRA-TS was not yet merged with it (see #409 for progress) and thus still uses older versions of both.

[brucou]

Great, thank you for your patience and support. I am closing this if you do not have any objections.

[wodr]

I applied the following workaround.
The idea is to replace all paths that contains spaces with a directory symbolic link that contains no space.
a) create a folder c:\nospace
b) cd \nospace
c) mklink /D prg c:\program files
repeat step c) for environment variable that contains space (e.g. program files (x86) or c:\users\your name)
create a bat file (nosapce.bat ) set the new environment variables for path, appdata, appdatalocal, ..
examples: path=c:\program files\nodejs becomes path=c:\nospace\prg\nodejs
run this nospace.bat
if you user home directory contains a space (e.g. c:\users\your name) create a link in the c:\users\ folder:
cd c:\users
mklink /D your "your name"
I had to do this, because npx still wanted to access c:\users\your as my home folder.
npx create-react-app my-app --scripts-version=react-scripts-ts
runs successfully.
cheers

[kellycode]

This works for me on Windows 10 for first time use of create-react-app:
npm --v
6.4.1
npm install -g create-react-app
npx create-react-app my-app