|
|||||
Lesson 1Use create-react-app tool to create a new react app on the command line and then open it with Visual Studio Codeanoldwebsite$ npx create-react-app hooks-intro npx: installed 98 in 4.403s Creating a new React app in /Users/ajmalkhan/Sync/codebench2020/reactjs/hooks/hooks-intro. Installing packages. This might take a couple of minutes. Installing react, react-dom, and react-scripts with cra-template... > fsevents@1.2.13 install /Users/ajmalkhan/Sync/codebench2020/reactjs/hooks/hooks-intro/node_modules/jest-haste-map/node_modules/fsevents > node install.js No receipt for 'com.apple.pkg.CLTools_Executables' found at '/'. No receipt for 'com.apple.pkg.DeveloperToolsCLILeo' found at '/'. No receipt for 'com.apple.pkg.DeveloperToolsCLI' found at '/'. gyp: No Xcode or CLT version detected! gyp ERR! configure error gyp ERR! stack Error: `gyp` failed with exit code: 1 gyp ERR! stack at ChildProcess.onCpExit (/Users/ajmalkhan/.nvm/versions/node/v12.16.1/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:351:16) gyp ERR! stack at ChildProcess.emit (events.js:311:20) gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:275:12) gyp ERR! System Darwin 19.4.0 gyp ERR! command "/Users/ajmalkhan/.nvm/versions/node/v12.16.1/bin/node" "/Users/ajmalkhan/.nvm/versions/node/v12.16.1/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild" gyp ERR! cwd /Users/ajmalkhan/Sync/codebench2020/reactjs/hooks/hooks-intro/node_modules/jest-haste-map/node_modules/fsevents gyp ERR! node -v v12.16.1 gyp ERR! node-gyp -v v5.1.0 gyp ERR! not ok > fsevents@1.2.13 install /Users/ajmalkhan/Sync/codebench2020/reactjs/hooks/hooks-intro/node_modules/watchpack-chokidar2/node_modules/fsevents > node install.js No receipt for 'com.apple.pkg.CLTools_Executables' found at '/'. No receipt for 'com.apple.pkg.DeveloperToolsCLILeo' found at '/'. No receipt for 'com.apple.pkg.DeveloperToolsCLI' found at '/'. gyp: No Xcode or CLT version detected! gyp ERR! configure error gyp ERR! stack Error: `gyp` failed with exit code: 1 gyp ERR! stack at ChildProcess.onCpExit (/Users/ajmalkhan/.nvm/versions/node/v12.16.1/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:351:16) gyp ERR! stack at ChildProcess.emit (events.js:311:20) gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:275:12) gyp ERR! System Darwin 19.4.0 gyp ERR! command "/Users/ajmalkhan/.nvm/versions/node/v12.16.1/bin/node" "/Users/ajmalkhan/.nvm/versions/node/v12.16.1/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild" gyp ERR! cwd /Users/ajmalkhan/Sync/codebench2020/reactjs/hooks/hooks-intro/node_modules/watchpack-chokidar2/node_modules/fsevents gyp ERR! node -v v12.16.1 gyp ERR! node-gyp -v v5.1.0 gyp ERR! not ok > fsevents@1.2.13 install /Users/ajmalkhan/Sync/codebench2020/reactjs/hooks/hooks-intro/node_modules/webpack-dev-server/node_modules/fsevents > node install.js No receipt for 'com.apple.pkg.CLTools_Executables' found at '/'. No receipt for 'com.apple.pkg.DeveloperToolsCLILeo' found at '/'. No receipt for 'com.apple.pkg.DeveloperToolsCLI' found at '/'. gyp: No Xcode or CLT version detected! gyp ERR! configure error gyp ERR! stack Error: `gyp` failed with exit code: 1 gyp ERR! stack at ChildProcess.onCpExit (/Users/ajmalkhan/.nvm/versions/node/v12.16.1/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:351:16) gyp ERR! stack at ChildProcess.emit (events.js:311:20) gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:275:12) gyp ERR! System Darwin 19.4.0 gyp ERR! command "/Users/ajmalkhan/.nvm/versions/node/v12.16.1/bin/node" "/Users/ajmalkhan/.nvm/versions/node/v12.16.1/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild" gyp ERR! cwd /Users/ajmalkhan/Sync/codebench2020/reactjs/hooks/hooks-intro/node_modules/webpack-dev-server/node_modules/fsevents gyp ERR! node -v v12.16.1 gyp ERR! node-gyp -v v5.1.0 gyp ERR! not ok > core-js@2.6.11 postinstall /Users/ajmalkhan/Sync/codebench2020/reactjs/hooks/hooks-intro/node_modules/babel-runtime/node_modules/core-js > node -e "try{require('./postinstall')}catch(e){}" > core-js@3.6.5 postinstall /Users/ajmalkhan/Sync/codebench2020/reactjs/hooks/hooks-intro/node_modules/core-js > node -e "try{require('./postinstall')}catch(e){}" > core-js-pure@3.6.5 postinstall /Users/ajmalkhan/Sync/codebench2020/reactjs/hooks/hooks-intro/node_modules/core-js-pure > node -e "try{require('./postinstall')}catch(e){}" + react@16.13.1 + react-dom@16.13.1 + cra-template@1.0.3 + react-scripts@3.4.1 added 1623 packages from 761 contributors and audited 1623 packages in 44.294s 59 packages are looking for funding run `npm fund` for details found 1 low severity vulnerability run `npm audit fix` to fix them, or `npm audit` for details Initialized a git repository. Installing template dependencies using npm... npm WARN tsutils@3.17.1 requires a peer of typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta but none is installed. You must install peer dependencies yourself. + @testing-library/user-event@7.2.1 + @testing-library/jest-dom@4.2.4 + @testing-library/react@9.5.0 added 36 packages from 56 contributors and audited 1659 packages in 10.998s 59 packages are looking for funding run `npm fund` for details found 1 low severity vulnerability run `npm audit fix` to fix them, or `npm audit` for details Removing template package using npm... npm WARN tsutils@3.17.1 requires a peer of typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta but none is installed. You must install peer dependencies yourself. removed 1 package and audited 1658 packages in 8.68s 59 packages are looking for funding run `npm fund` for details found 1 low severity vulnerability run `npm audit fix` to fix them, or `npm audit` for details Created git commit. Success! Created hooks-intro at /Users/ajmalkhan/Sync/codebench2020/reactjs/hooks/hooks-intro 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 hooks-intro npm start Happy hacking! anoldwebsite$ ls hooks-intro anoldwebsite$ cd hooks-intro anoldwebsite$ ls README.md node_modules package-lock.json package.json public src anoldwebsite$ cat package.json { "name": "hooks-intro", "version": "0.1.0", "private": true, "dependencies": { "@testing-library/jest-dom": "^4.2.4", "@testing-library/react": "^9.5.0", "@testing-library/user-event": "^7.2.1", "react": "^16.13.1", "react-dom": "^16.13.1", "react-scripts": "3.4.1" }, "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" }, "eslintConfig": { "extends": "react-app" }, "browserslist": { "production": [ ">0.2%", "not dead", "not op_mini all" ], "development": [ "last 1 chrome version", "last 1 firefox version", "last 1 safari version" ] } } anoldwebsite$ code . anoldwebsite$ |
|||||
|