Search code examples
node.jsbatch-filecreate-react-app

Why does npx end batch script?


I am working on creating a simple setup script that I can use for most of my React applications. I want to be able to run the script and have it install all the npm packages I need as well as writing the boilerplate code for the configuration files. This is my current script:

@echo off

set /p userInput=Enter the folder name for your new React app: 
mkdir %userInput%
cd %userInput%

npx create-react-app . --template cra-template-pwa
npm install -D tailwindcss
npx tailwindcss init

echo.
echo Finished setting up React environment
pause

The script will run all the way up to the npx create-react-app line. When it gets to this line, it will run the command and create the React app, then die when CRA is finished. How can I make the script execute the rest of my commands?


Solution

  • There can be used the following improved batch file:

    @echo off
    
    :UserPrompt
    set "userInput="
    set /P "userInput=Enter the folder name for your new React app: "
    if not defined userInput goto UserPrompt
    set "userInput=%userInput:"=%"
    if not defined userInput goto UserPrompt
    mkdir "%userInput%" 2>nul
    if not exist "%userInput%\" echo ERROR: Failed to create the directory: "%userInput%"& goto UserPrompt
    pushd "%userInput%"
    
    call npx.cmd create-react-app . --template cra-template-pwa
    call npm.cmd install -D tailwindcss
    call npx.cmd tailwindcss init
    
    echo(
    echo Finished setting up React environment
    popd
    cd /D "%userInput%" 2>nul
    pause
    

    npx and npm are batch files which must be called from within a batch file using the command CALL. See also: How to call a batch file that is one level up from the current batch file directory? This answer explains the four existing methods running a batch file from within a batch file and what are the differences.

    See also: How to stop Windows command interpreter from quitting batch file execution on an incorrect user input? It explains in full details how to make a user prompt fail-safe and secure.

    The user has the freedom to enter any string. There can be entered also:

    "\\server\share\folder\Development & Test (!) 100%"
    

    The batch file as posted works even for such a user input.

    This batch file requires enabled command extensions and disabled delayed variable expansion. That is the Windows default execution environment on starting a command process for processing of a batch file.

    There can be used setlocal EnableExtensions DisableDelayedExpansion below the first line @echo off and endlocal at end of the batch file or above the command pause. But that would be counterproductive on call npx.cmd tailwindcss init defines or modifies environment variables which should still exist after processing of the batch file ended.

    The Windows Command Processor does not change by Windows default the current directory to a folder on a network resource specified with its UNC path. This is the reason for using pushd and popd. The command cd at end tries finally nevertheless changing the current working directory to the directory as entered by the user in case of the user runs the batch file from within a command prompt window and expects that directory being finally the current directory after batch file execution.

    • call /?
    • cd /?
    • echo /?
    • endlocal /?
    • goto /?
    • if /?
    • mkdir /? or md /?
    • pause /?
    • popd /?
    • pushd /?
    • set /?
    • setlocal /?

    See also the DosTips forum topic: ECHO. FAILS to give text or blank line - Instead use ECHO/
    The command echo( is the only possibility to output an empty line without any file system access.