[bug] create-tauri-app on Linux with React fails

[dArignac]

Describe the bug

When I run pnpx create-tauri-app and choose React als library, then the installation fails. There are 2 errors, on with Git and one with the installation of @tauri-apps/cli@latest, see below.

Notes:

• Installing choosing vanillajs works.
• using npx has the same result

Reproduction

1. run pnpx create-tauri-app and choose React with Typescript

Expected behavior

Installation completes without any errors.

Platform and versions

Ubuntu 21.04
tauri 1.0.0-rc.1

Stack trace

$ pnpx create-tauri-app                                                                                                                                           [~/projects/tmp][22-02-12/8:11:43][R-0][!8894]
✔ Install the following package: create-tauri-app@latest? (Y/n) · true
Packages: +99
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Packages are hard linked from the content-addressable store to the virtual store.
  Content-addressable store is at: /home/alex/.pnpm-store/v3
  Virtual store is at:             node_modules/.pnpm
Progress: resolved 99, reused 99, downloaded 0, added 99, done

/home/alex/.pnpm-store/v3/tmp/_npx/29351/5:
+ create-tauri-app 1.0.0-rc.1

We hope to help you create something special with Tauri!
You will have a choice of one of the UI frameworks supported by the greater web tech community.
This tool should get you quickly started. See our docs at https://tauri.studio/

If you haven't already, please take a moment to setup your system.
You may find the requirements here: https://tauri.studio/en/docs/get-started/setup-linux/
    
Press any key to continue...
? What is your app name? tauri-app
? What should the window title be? Tauri App
? What UI recipe would you like to add? create-react-app (https://create-react-app.dev/)
? Add "@tauri-apps/api" npm package? Yes
? Which create-react-app template would you like to use? create-react-app (Typescript)
>> Running initial command(s)

Creating a new React app in /home/alex/projects/tmp/tauri-app.

Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template-typescript...


added 1366 packages in 9s

169 packages are looking for funding
  run `npm fund` for details

Initialized a git repository.

Installing template dependencies using npm...
npm WARN deprecated source-map-resolve@0.6.0: See https://github.com/lydell/source-map-resolve#deprecated

added 38 packages, and changed 1 package in 2s

169 packages are looking for funding
  run `npm fund` for details

We detected TypeScript in your project (src/App.test.tsx) and created a tsconfig.json file for you.

Your tsconfig.json has been populated with default values.

Removing template package using npm...


removed 1 package, and audited 1404 packages in 2s

169 packages are looking for funding
  run `npm fund` for details

8 moderate severity vulnerabilities

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.
Git commit not created Error: Command failed: git commit -m "Initialize project using Create React App"
    at checkExecSyncError (node:child_process:828:11)
    at execSync (node:child_process:902:15)
    at tryGitCommit (/home/alex/projects/tmp/tauri-app/node_modules/react-scripts/scripts/init.js:62:5)
    at module.exports (/home/alex/projects/tmp/tauri-app/node_modules/react-scripts/scripts/init.js:350:25)
    at [eval]:3:14
    at Script.runInThisContext (node:vm:129:12)
    at Object.runInThisContext (node:vm:305:38)
    at node:internal/process/execution:75:19
    at [eval]-wrapper:6:22
    at evalScript (node:internal/process/execution:74:60) {
  status: 128,
  signal: null,
  output: [ null, null, null ],
  pid: 29809,
  stdout: null,
  stderr: null
}
Removing .git directory...

Success! Created tauri-app at /home/alex/projects/tmp/tauri-app
Inside that directory, you can run several commands:

  npm start
    Starts the development server.

  npm run build
    Bundles the app into static files for production.

  npm test
    Starts the test runner.

  npm run eject
    Removes this tool and copies build dependencies, configuration files
    and scripts into the app directory. If you do this, you can’t go back!

We suggest that you begin by typing:

  cd tauri-app
  npm start

Happy hacking!
>> Installing any additional needed dependencies
- Installing @tauri-apps/cli@latest, cross-env...
npm ERR! code EINVALIDTAGNAME
npm ERR! Invalid tag name "latest cross-env": Tags may not have any characters that encodeURIComponent encodes.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/alex/.npm/_logs/2022-02-12T07_12_16_206Z-debug-0.log
Error with command: npm
Error: Error: Command failed with exit code 1: npm install --save-dev --ignore-scripts @tauri-apps/cli@latest cross-env
    at /home/alex/.pnpm-store/v3/tmp/_npx/29351/5/node_modules/.pnpm/create-tauri-app@1.0.0-rc.1/node_modules/create-tauri-app/dist/index.js:62:15
    at Generator.throw (<anonymous>)
    at rejected (/home/alex/.pnpm-store/v3/tmp/_npx/29351/5/node_modules/.pnpm/create-tauri-app@1.0.0-rc.1/node_modules/create-tauri-app/dist/index.js:39:65)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)

Additional context

No response

[amrbashir]

The git error is from create-react-app, nothing we can do there.

As for the cli installation, can you post the debug log for that run? its path is in the error message you posted.

[dArignac]

Hi @amrbashir,

sure, here it is:

0 verbose cli [
0 verbose cli   '/home/alex/.volta/tools/image/node/16.14.0/bin/node',
0 verbose cli   '/home/alex/.volta/tools/image/node/16.14.0/bin/npm',
0 verbose cli   'install',
0 verbose cli   '--save-dev',
0 verbose cli   '--ignore-scripts',
0 verbose cli   '@tauri-apps/cli@latest cross-env'
0 verbose cli ]
1 info using npm@8.3.1
2 info using node@v16.14.0
3 timing npm:load:whichnode Completed in 0ms
4 timing config:load:defaults Completed in 1ms
5 timing config:load:file:/home/alex/.volta/tools/image/node/16.14.0/lib/node_modules/npm/npmrc Completed in 1ms
6 timing config:load:builtin Completed in 1ms
7 timing config:load:cli Completed in 1ms
8 timing config:load:env Completed in 1ms
9 timing config:load:file:/home/alex/projects/tmp/tauri-app/.npmrc Completed in 1ms
10 timing config:load:project Completed in 1ms
11 timing config:load:file:/home/alex/.npmrc Completed in 0ms
12 timing config:load:user Completed in 0ms
13 timing config:load:file:/home/alex/.volta/tools/image/node/16.14.0/etc/npmrc Completed in 0ms
14 timing config:load:global Completed in 0ms
15 timing config:load:validate Completed in 0ms
16 timing config:load:credentials Completed in 1ms
17 timing config:load:setEnvs Completed in 1ms
18 timing config:load Completed in 7ms
19 timing npm:load:configload Completed in 7ms
20 timing npm:load:setTitle Completed in 0ms
21 timing config:load:flatten Completed in 2ms
22 timing npm:load:display Completed in 4ms
23 verbose logfile /home/alex/.npm/_logs/2022-02-12T07_12_16_206Z-debug-0.log
24 timing npm:load:logFile Completed in 3ms
25 timing npm:load:timers Completed in 0ms
26 timing npm:load:configScope Completed in 0ms
27 timing npm:load Completed in 14ms
28 timing arborist:ctor Completed in 1ms
29 silly logfile start cleaning logs, removing 1 files
30 timing idealTree:init Completed in 584ms
31 timing idealTree Completed in 585ms
32 timing command:install Completed in 595ms
33 verbose stack Error: Invalid tag name "latest cross-env": Tags may not have any characters that encodeURIComponent encodes.
33 verbose stack     at invalidTagName (/home/alex/.volta/tools/image/node/16.14.0/lib/node_modules/npm/node_modules/npm-package-arg/npa.js:89:15)
33 verbose stack     at fromRegistry (/home/alex/.volta/tools/image/node/16.14.0/lib/node_modules/npm/node_modules/npm-package-arg/npa.js:343:13)
33 verbose stack     at resolve (/home/alex/.volta/tools/image/node/16.14.0/lib/node_modules/npm/node_modules/npm-package-arg/npa.js:80:12)
33 verbose stack     at npa (/home/alex/.volta/tools/image/node/16.14.0/lib/node_modules/npm/node_modules/npm-package-arg/npa.js:48:10)
33 verbose stack     at /home/alex/.volta/tools/image/node/16.14.0/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/build-ideal-tree.js:504:50
33 verbose stack     at Array.map (<anonymous>)
33 verbose stack     at Arborist.[add] (/home/alex/.volta/tools/image/node/16.14.0/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/build-ideal-tree.js:501:28)
33 verbose stack     at Arborist.[applyUserRequestsToNode] (/home/alex/.volta/tools/image/node/16.14.0/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/build-ideal-tree.js:472:23)
33 verbose stack     at Arborist.[applyUserRequests] (/home/alex/.volta/tools/image/node/16.14.0/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/build-ideal-tree.js:409:43)
33 verbose stack     at Arborist.buildIdealTree (/home/alex/.volta/tools/image/node/16.14.0/lib/node_modules/npm/node_modules/@npmcli/arborist/lib/arborist/build-ideal-tree.js:215:37)
34 verbose cwd /home/alex/projects/tmp/tauri-app
35 verbose Linux 5.11.0-49-generic
36 verbose argv "/home/alex/.volta/tools/image/node/16.14.0/bin/node" "/home/alex/.volta/tools/image/node/16.14.0/bin/npm" "install" "--save-dev" "--ignore-scripts" "@tauri-apps/cli@latest cross-env"
37 verbose node v16.14.0
38 verbose npm  v8.3.1
39 error code EINVALIDTAGNAME
40 error Invalid tag name "latest cross-env": Tags may not have any characters that encodeURIComponent encodes.
41 verbose exit 1
42 timing npm Completed in 753ms
43 verbose unfinished npm timer reify 1644649936361
44 verbose unfinished npm timer reify:loadTrees 1644649936369
45 verbose unfinished npm timer idealTree:userRequests 1644649936954
46 verbose code 1
47 error A complete log of this run can be found in:
47 error     /home/alex/.npm/_logs/2022-02-12T07_12_16_206Z-debug-0.log

[dArignac]

Thanks for fixing this quickly! I can confirm that it works with tauri version v1.0.0-rc.1.