MacOS安装react。问题 -- npm全局包的权限问题

时间 2019-12-01

标签 macos 安装 react 问题 npm 全局权限栏目 React 繁體版

原文原文链接

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

首先，在安装react以前要先配置好nodereact

1.安装node

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

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

npm -v用来检测npmgithub

2.经过npm使用react

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

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

通常这个时候就能够使用cnpm来进行操做，可是个人一直显示命令未找到。因此我放弃了使用cnpm，继续使用npm命令npm

给npm配置taobao镜像的registrygulp

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

而后直接用app

npm install gulp less --save-dev

就是从taobao镜像拿包了less

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  // 启动项目