美文网首页
React环境、项目创建与导入

React环境、项目创建与导入

作者: 游园拾忆 | 来源:发表于2022-06-12 15:46 被阅读0次

    一、React环境

    1 下载 nodejs

    https://nodejs.org/en/download/

    2 安装

    Windows程序安装步骤,没啥特殊的。
    我的安装路径 D:\Program Files\nodejs

    3 修改npm默认的模板安装路径

    默认是C盘。修改一下:在指定位置(我想改在D安装目录下)创建文件夹 node_globalnode_cache
    启动 PowerShell (cmd) 执行

    npm config set prefix "D:\Program Files\nodejs\node_global"
    
    npm config set cache "D:\Program Files\nodejs\node_cache"
    

    4 修改环境变量

    修改用户变量中的Path
     原值是: C:\Users\Administrator\AppData\Roaming\npm
     修改为: D:\Program Files\nodejs\node_global
    修改系统变量,增加 NODE_PATH
     值为:D:\Program Files\nodejs\node_global\node_modules

    5 设置源镜像

    默认镜像是外国的,修改为淘宝的。有两种方式:

    1. 将npm设置为淘宝镜像
    # 修改
    npm config set registry https://registry.npmmirror.com
    # 查看npm设置
    npm config get registry
    
    1. 使用淘宝定制的的cnpm:
    # 安装cnpm
    npm install -g cnpm --registry=https://registry.npmmirror.com
    # 查看cnpm设置
    cnpm config get registry
    

    我电脑使用cnpm时出现了个系统问题
    cnpm : 无法加载文件 D:\Program Files\nodejs\node_global\cnpm.ps1,因为在此系统上禁止运行脚本。
    解决方法:管理员方式PowerShell 执行 set-ExecutionPolicy RemoteSigned


    二、React项目创建

    安装 react 脚手架

    安装:

    cnpm install -g create-react-app
    

    查看版本:

    create-react-app -V
    

    创建 react 项目

    • 创建命令:
    create-react-app react-demo
    or
    npx create-react-app react-demo
    
    • 启动
    npm start
    

    导入 react 项目

    • 下载好项目
    • 安装项目所用模块
    npm install
    
    • 启动
    npm start
    


    三、常用命令

    安装依赖模块,加-g全局安装,否则本地安装

    npm install 模块名 -g
    

    卸载依赖模块,加-g全局卸载,否则本地卸载

    npm uninstall -g 模块名
    

    安装多个模块

    npm install 模块1 模块2 模块n --save
    

    启动项目

    npm start
    

    打包构建项目

    npm run build
    

    相关文章

      网友评论

          本文标题:React环境、项目创建与导入

          本文链接:https://www.haomeiwen.com/subject/riigmrtx.html