react:创建新项目

React中文官方文档给出创建新应用的最佳方式(命令行)。

npx create-react-app my-app
cd my-app
npm start

终端直接报错,提示如下:

bogon:~ jing$ npx creat-react-app myJob_react
npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.com/creat-react-app - Not found
npm ERR! 404 
npm ERR! 404  'creat-react-app@latest' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
npm ERR! 404 
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/jing/.npm/_logs/2020-08-25T08_15_11_792Z-debug.log
安装 [ 'creat-react-app@latest' ] 失败,错误代码:1

根据提示应该是没有全局安装creat-react-app这个脚手架工具造成的,因此我们需要先安装creat-react-app这个脚手架工具造成,安装命令提示入下:

npm install -g create-react-app

但是,我本地这样也给我报错了,也是醉了。

npm ERR! code E503
npm ERR! 503 Service Temporarily Unavailable - GET https://cdn.npm.taobao.org/create-react-app/-/create-react-app-3.4.1.tgz
npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/jing/.npm/_logs/2020-08-25T08_33_29_956Z-debug.log

研究了半天是npm 淘宝镜像的问题,换了几次镜像也没有安装成功,决定换个方式安装。使用 cnpm,使用之前先确认下是否安装cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org

cnpm -v
cnpm install -g create-react-app
cd my-app
npm start

中间还有很多曲折,在自己查看报错信息后一一对应安装,改正,总算开启了第一个react项目。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
回答: 如果你之前全局安装过旧的react-native-cli命令行工具,请使用npm uninstall -g react-native-cli卸载掉它以避免一些冲突。使用 React Native 内建的命令行工具来创建一个名为"MyDemoRc"的项目。这个命令行工具不需要安装,可以直接用 node 自带的npx命令来使用:npx react-native init MyDemoRc。\[1\]另外,你也可以使用官方脚手架create-react-app创建React项目。首先通过npm全局安装create-react-appnpm install -g create-react-app。然后使用create-react-app命令来创建项目:create-react-app <项目名>。例如,创建一个名为my-app项目:create-react-app my-app。进入项目目录:cd my-app。最后,运行项目npm run start 或 yarn start。\[2\]在App.js文件中创建一个组件并导出,可以按照以下代码编写:import React from 'react'; class App extends React.Component { render() { return( <div> <h1>Hello World</h1> </div> ) } } export default App。\[3\] #### 引用[.reference_title] - *1* [React Native 创建项目详细教程](https://blog.csdn.net/afufufufu/article/details/126361477)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* *3* [创建React项目命令流程](https://blog.csdn.net/MDistance/article/details/109074580)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值