网上的教程有好多,在这里不一一列举,我只介绍我今天安装成功的步骤

首先,在安装react之前要先配置好node

1.安装node

在这里下载node的安装包https://nodejs.org/en/download/ 。我下载的是.pkg文件,直接双击安装就好

node —v命令检验是否安装成功

npm -v用来检测npm

2.通过npm使用react

国内使用 npm 速度很慢,你可以使用淘宝定制的 cnpm (gzip 压缩支持) 命令行工具代替默认的 npm:

$ npm install -g cnpm --registry=https://registry.npm.taobao.org
$ npm config set registry https://registry.npm.taobao.org

一般这个时候就可以使用cnpm来进行操作,但是我的一直显示命令未找到。所以我放弃了使用cnpm,继续使用npm命令

给npm配置taobao镜像的registry

npm config set registry https://registry.npm.taobao.org

然后直接用

npm install gulp less --save-dev

就是从taobao镜像拿包了

3.两种react开发环境构建

使用 create-react-app 快速构建 React 开发环境

create-react-app 是来自于 Facebook,通过该命令我们无需配置就能快速构建 React 开发环境。

create-react-app 自动创建的项目是基于 Webpack + ES6 。

执行以下命令创建项目:

$ cnpm install -g create-react-app
$ create-react-app my-app
$ cd my-app/
$ npm start

MacOS,安装npm全局包提示没有写入权限:

npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules

 
 

 

解决方法:

修改npm包所安装目录的权限:sudo chown -R $USER /usr/local   然后输入密码就可以了

 
 

查看目录是否已切换权限:$ls -l /usr/local

接下来可以进行npm全局包安装:例如$npm install webpack -g

-----------------------------

安装问题

123deAir:~ mxt$ npm install create-react-app -g

WARN checkPermissions Missing write access to /usr/local/lib/node_modules

ERR! path /usr/local/lib/node_modules

ERR! code EACCES

ERR! errno -13

ERR! syscall access

ERR! Error: EACCES: permission denied, access '/usr/local/lib/node_modules'

ERR!  { [Error: EACCES: permission denied, access '/usr/local/lib/node_modules']

ERR!   stack:

ERR!    'Error: EACCES: permission denied, access \'/usr/local/lib/node_modules\'',

ERR!   errno: -13,

ERR!   code: 'EACCES',

ERR!   syscall: 'access',

ERR!   path: '/usr/local/lib/node_modules' }

npm

ERR! The operation was rejected by your operating system.

ERR! It is likely you do not have the permissions to access this file as the current user

npm

ERR! If you believe this might be a permissions issue, please double-check the

ERR! permissions of the file and its containing directories, or try running

ERR! the command again as root/Administrator (though this is not recommended).

ERR! A complete log of this run can be found in:

ERR!     /Users/mxt/.npm/_logs/2018-12-19T09_09_15_552Z-debug.log

123deAir:~ mxt$ npm install -g create-react-app

WARN checkPermissions Missing write access to /usr/local/lib/node_modules

ERR! path /usr/local/lib/node_modules

ERR! code EACCES

ERR! errno -13

ERR! syscall access

ERR! Error: EACCES: permission denied, access '/usr/local/lib/node_modules'

ERR!  { [Error: EACCES: permission denied, access '/usr/local/lib/node_modules']

ERR!   stack:

ERR!    'Error: EACCES: permission denied, access \'/usr/local/lib/node_modules\'',

ERR!   errno: -13,

ERR!   code: 'EACCES',

ERR!   syscall: 'access',

ERR!   path: '/usr/local/lib/node_modules' }

npm

ERR! The operation was rejected by your operating system.

ERR! It is likely you do not have the permissions to access this file as the current user

npm

ERR! If you believe this might be a permissions issue, please double-check the

ERR! permissions of the file and its containing directories, or try running

ERR! the command again as root/Administrator (though this is not recommended).

ERR! A complete log of this run can be found in:

ERR!     /Users/mxt/.npm/_logs/2018-12-19T09_11_38_006Z-debug.log

123deAir:~ mxt$ sudo npm install webpack -g

Password:

/usr/local/bin/webpack -> /usr/local/lib/node_modules/webpack/bin/webpack.js

> fsevents@1.2.4 install /usr/local/lib/node_modules/webpack/node_modules/fsevents

> node install

[fsevents] Success: "/usr/local/lib/node_modules/webpack/node_modules/fsevents/lib/binding/Release/node-v64-darwin-x64/fse.node" already installed

Pass --update-binary to reinstall or --build-from-source to recompile

+ webpack@4.27.1

added 389 packages from 297 contributors in 30.263s

123deAir:~ mxt$ sudo chown -R $USER /usr/local

123deAir:~ mxt$ ls -l /usr/local

total 0

drwxr-xr-x   6 mxt  wheel   204 12 19 01:19 bin

drwxr-xr-x   3 mxt  wheel   102 12 10 13:29 include

drwxr-xr-x  73 mxt  wheel  2482 12 19 00:28 lib

drwxr-xr-x   5 mxt  wheel   170 12 10 13:29 share

123deAir:~ mxt$ sudo chown -R $USER /usr/local

123deAir:~ mxt$ ls -l /usr/local

total 0

drwxr-xr-x   6 mxt  wheel   204 12 19 01:19 bin

drwxr-xr-x   3 mxt  wheel   102 12 10 13:29 include

drwxr-xr-x  73 mxt  wheel  2482 12 19 00:28 lib

drwxr-xr-x   5 mxt  wheel   170 12 10 13:29 share

123deAir:~ mxt$ webpack -g

One CLI for webpack must be installed. These are recommended choices, delivered as separate packages:

- webpack-cli (https://github.com/webpack/webpack-cli)

The original webpack full-featured CLI.

We will use "npm" to install the CLI via "npm install -D".

Do you want to install 'webpack-cli' (yes/no): npm install webpack -g

You need to install 'webpack-cli' to use webpack via CLI.

You can also install the CLI manually.

123deAir:~ mxt$ npm install -g create-react-app

/usr/local/bin/create-react-app -> /usr/local/lib/node_modules/create-react-app/index.js

+ create-react-app@2.1.1

added 63 packages from 20 contributors in 8.958s

123deAir:~ mxt$ create-react-app my-app

Creating a new React app in /Users/mxt/my-app.

Installing packages. This might take a couple of minutes.

Installing react, react-dom, and react-scripts...

> fsevents@1.2.4 install /Users/mxt/my-app/node_modules/fsevents

> node install

[fsevents] Success: "/Users/mxt/my-app/node_modules/fsevents/lib/binding/Release/node-v64-darwin-x64/fse.node" already installed

Pass --update-binary to reinstall or --build-from-source to recompile

+ react-scripts@2.1.1

+ react-dom@16.6.3

+ react@16.6.3

added 1776 packages from 684 contributors in 120.945s

Success! Created my-app at /Users/mxt/my-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 my-app

npm start

Happy hacking!

123deAir:~ mxt$

/////////安装命令

npm install create-react-app -g  // 全局安装create-react-app,如果不想全局安装,则不要-g。可能会很慢,可以使用cnpm来安装

create-react-app my-app  // my-app是项目名

cd my-app  

npm start  // 启动项目

MacOS安装react。问题 -- npm全局包的权限问题的更多相关文章

  1. MacOS安装npm全局包的权限问题

    MacOS,安装npm全局包提示没有写入权限: npm WARN checkPermissions Missing write access to /usr/local/lib/node_module ...

  2. Mac下安装npm全局包提示权限不够

    Mac OS下安装npm的全局包,总是出现如下提示Missing write access,需要提升权限才能继续. npm WARN checkPermissions Missing write ac ...

  3. [转] 安装npm全局包提示权限不够

    方法1 sudo npm i -g npm 方法2 修改usr/local的权限.使用sudo有一个风险是安装包可能会运行自己的一些脚本,使sudo操作变的不可控,不安全.可以通过将/usr/loca ...

  4. 安装npm全局包提示没有写入权限: npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules

    方法一 安装npm全局包提示没有写入权限: npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules ...

  5. npm 安装全局包 不是内部或外部命令的问题

    场景: npm已经安装成功  ,通过npm install -g 安装的 全局包 提示不是内部或外部命令 第一步: npm list -g --depth=0:查看npm全局包的路径,和有哪些安装包 ...

  6. windows系统下nodejs安装、环境配置及删除NPM全局配置

    nodejs安装及设置NPM全局路径 删除NPM全局路径配置 一.nodejs安装及设置NPM全局路径 第一步:下载安装文件 下载nodejs,官网:http://nodejs.org/downloa ...

  7. 一行命令更新所有 npm 依赖包

    npm 包的更新速度很快,为了将项目或者全局依赖更新到最新版本.传统的做法是一个一个更新,比如更新 react 到最新版本,命令如下: # npm npm i --save react@latest ...

  8. [nodejs]修改全局包位置,修复npm安装全局模块命令失效。好记性不如烂笔头

    修复npm -g 全局安装命令失效,好的吧不得不承认,好记性不如烂笔头,我居然会忘记方法哈哈哈 Linux安装nodejs sudo apt install node sudo apt install ...

  9. npm学习(四)之如何安装全局包、更新全局安装的包、卸载全局安装的包

    如何安装全局包 有两种方式用来安装 npm 包:本地安装和全局安装.选用哪种方式来安装,取决于你如何使用这个包. 如果你想将其作为一个命令行工具,那么你应该将其安装到全局.这种安装方式后可以让你在任何 ...

随机推荐

  1. Enrolment API

    由于Moodle 2.0有一个用户注册的新概念,它们完全独立于角色和功能.能力通常与注册状态结合使用. 什么是注册? 登记的用户可以完全参加一门课程.活跃用户注册允许用户输入课程.只有注册的用户可能是 ...

  2. 全排列-hdu1027

    题目描述: 题目大意:现在给我们两个数字,N和M.我们应该编程找出由1到N组成的第M个最小序列.主要运用了全排列的思想,运用了全排列中next_permutation()函数: next_permut ...

  3. metasploit常用服务扫描和利用模块

    metasploit常用服务扫描和利用模块 SMB扫描 smb枚举auxiliary/scanner/smb/smb_enumusers 扫描命名管道auxiliary/scanner/smb/pip ...

  4. P1510 精卫填海

    P1510 精卫填海二分答案二分背包容量,判断能否满足v.判断的话就跑01背包就好了. #include<iostream> #include<cstdio> #include ...

  5. 动态规划-线性dp-hdu-4055

    https://www.cnblogs.com/31415926535x/p/10423047.html 这道题是大连的某一年的现场赛的题hdu-4055 ,,,刚开始做线性dp的题,,看了好半天才看 ...

  6. iOS 技术篇:如何处理多个网络请求的先后(依赖)关系

    在开发过程中,不知你有没有碰到过在一个页面 用到了多个网络请求,而且根据业务需求,需要有次序的执行A B C 网络请求? 你可能会想到,我在A的请求成功回调里去处理B,在B的回调里去请求C,但你后来会 ...

  7. AM335x启动

    参考文件: 1.TI.Reference_Manual_1.pdf http://pan.baidu.com/s/1c1BJNtm 2.TI_AM335X.pdf http://pan.baidu.c ...

  8. 牛客练习赛27.B.手办(枚举)

    题目链接 orz zzx! 题目看似要求\[\sum_{k=1}^n\sum_{a=1}^k\sum_{b=1}^k[k\mid a\times b]\] 实际我们可以求\[\sum_{k=1}^n\ ...

  9. BZOJ.3667.Rabin-Miller算法(MillerRabin PollardRho)

    题目链接 Pollard_Rho:http://blog.csdn.net/thy_asdf/article/details/51347390 #include<cstdio> #incl ...

  10. 51Nod.1237.最大公约数之和 V3(莫比乌斯反演 杜教筛 欧拉函数)

    题目链接 \(Description\) \(n\leq 10^{10}\),求 \[\sum_{i=1}^n\sum_{j=1}^ngcd(i,j)\ mod\ (1e9+7)\] \(Soluti ...