🇨🇳Ynthm
文章 标签 分类 关于
🇨🇳Ynthm

目录

Node.js 环境配置

Ynthm Wang 收录于 开发工具
   约 2438 字   预计阅读 5 分钟 

Node.js 是能够在服务器端运行JavaScript 的开放源代码、跨平台执行环境。Node.js 由 OpenJS Foundation 持有和维护，亦为Linux 基金会的项目。

Node.js 官方地址

版本管理工具

nvm

macOS 安装 nvm

删除非 nvm 安装的 node (如果有)

1
2
3
4
5
6

brew uninstall --force node
sudo rm -r /usr/local/lib/node_modules
brew cleanup
sudo rm -r /usr/local/include/node
# 检查node 是否删了
npm -version

1
2
3
4

brew install nvm
mkdir ~/.nvm

vim ~/.zshrc

1
2
3

export NVM_DIR="$HOME/.nvm"
  [ -s "/usr/local/opt/nvm/nvm.sh" ] && . "/usr/local/opt/nvm/nvm.sh"  # This loads nvm
  [ -s "/usr/local/opt/nvm/etc/bash_completion" ] && . "/usr/local/opt/nvm/etc/bash_completion"  # This loads nvm bash_completion

1

source ~/.zshrc

nvm 常用命令

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12

nvm ls-remote --lts
nvm install v14.18.3
node -v
npm -v
nvm use v14.18.3
nvm current
nvm ls

# 安装最新 lts 版本
nvm install --lts
nvm use --lts
nvm list

n

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20

# 全局安装n
npm install -g n
# 升级到最新稳定版
n stable 
# 升级到最新版
n latest
# 升级到定制版
n v6.11.5
# 切换使用版本
n 6.11.5

# /usr/local/n/versions/node/6.11.5

which node
vim /etc/profile

export NODE_HOME=/usr/local/n/versions/node/6.11.5
export PATH=$NODE_HOME/bin:$PATH

source /etc/profile

Ubuntu

1
2
3
4

curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash -
sudo apt-get install -y nodejs
# 可选
sudo apt-get install -y build-essential

CentOS

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

# RPM 包仓库安装 Node.js
curl --silent --location https://rpm.nodesource.com/setup_8.x | sudo bash -
sudo yum -y install nodejs

# 可选
sudo yum install gcc-c++ make

# 从EPEL库安装Node.js
sudo yum install epel-release
sudo yum install nodejs

npm 包管理工具

NPM是随同NodeJS一起安装的包管理工具

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22

# 查看帮助
npm help
# 创建模块
npm init
# npm 资源库注册用户
npm adduser
# 发布模块
npm publish
# 本地安装模块
npm install express
# 全局安装模块
npm install express -g
# 卸载模块
npm uninstall express
# 更新模块
npm update express
# 搜索模块
npm search express
# 查看当前模块依赖
npm list
# 查看所有全局安装的模块
npm list -g

全局安装与本地安装

npm 的包安装分为本地安装（local）、全局安装（global）两种，从敲的命令行来看，差别只是有没有-g而已，比如

本地安装

  • 将安装包放在 ./node_modules 下（运行 npm 命令时所在的目录），如果没有 node_modules 目录，会在当前执行 npm 命令的目录下生成 node_modules 目录。
  • 可以通过 require() 来引入本地安装的包。

全局安装

  • 将安装包放在 /usr/local 下或者你 node 的安装目录。
  • 可以直接在命令行里使用。

使用 package.json

package.json 位于模块的目录下，用于定义包的属性。

属性说明

  • name - 包名。
  • version - 包的版本号。
  • description - 包的描述。
  • homepage - 包的官网 url 。
  • author - 包的作者姓名。
  • contributors - 包的其他贡献者姓名。
  • dependencies - 依赖包列表。如果依赖包没有安装，npm 会自动将依赖包安装在 node_module 目录下。
  • repository - 包代码存放的地方的类型，可以是 git 或 svn，git 可在 Github 上。
  • main - main 字段指定了程序的主入口文件，require(‘moduleName’) 就会加载这个文件。这个字段的默认值是模块根目录下面的 index.js。
  • keywords - 关键字

使用淘宝 NPM 镜像

1
2
3
4
5
6

npm config get registry
npm config set registry https://registry.npm.taobao.org/
npm cache clean --force

npm install -g cnpm --registry=https://registry.npm.taobao.org
cnpm install [name]

npm 常用命令

  • NPM提供了很多命令，例如install和publish，使用npm help可查看所有命令。
  • 使用npm help <command>可查看某条命令的详细帮助，例如npm help install。
  • 在package.json所在目录下使用npm install . -g可先在本地安装当前命令行程序，可用于发布前的本地测试。
  • 使用npm update <package>可以把当前目录下node_modules子目录里边的对应模块更新至最新版本。
  • 使用npm update <package> -g可以把全局安装的对应命令行程序更新至最新版。
  • 使用npm cache clear可以清空NPM本地缓存，用于对付使用相同版本号发布新版本代码的人。
  • 使用npm unpublish <package>@<version>可以撤销发布自己发布过的某个版本代码。

yarn

Yarn is a package manager that doubles down as project manager. Whether you work on one-shot projects or large monorepos, as a hobbyist or an enterprise user, we’ve got you covered.

JavaScript package manager

代码通过包（package）（或者称为模块（module））的方式来共享。 一个包里包含所有需要共享的代码，以及描述包信息的文件，称为package.json。

  • package.json：包含包的所有依赖信息；
  • yarn.lock：记录每一个依赖项的确切版本信息；

NPM 是 Node.js（一个基于 Google V8 引擎的 JavaScript 运行环境）的包管理和分发工具。

Yarn 快速、可靠、安全的依赖管理。

  • Yarn 会缓存它下载的每个包，所以无需重复下载。它还能并行化操作以最大化资源利用率，安装速度之快前所未有。
  • Yarn会在每个安装包被执行前校验其完整性。
  • Yarn 使用格式详尽而又简洁的 lockfile文件 和确定性算法来安装依赖，能够保证在一个系统上的运行的安装过程也会以同样的方式运行在其他系统上。
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22

npm install --global yarn
# This will also install Node.js if it is not already installed.
brew install yarn

yarn --version
yarn -v
# cd到项目根目录 初始新项目 生成 package.json
yarn init
# 添加依赖包 [package]@[version]   [package]@[tag]
yarn add [package]
# 升级依赖包 [package]@[version]   [package]@[tag]
yarn upgrade [package]
# 移除依赖包
yarn remove [package]
# 安装项目全部依赖  yarn install
yarn

# 获取源设置
yarn config get registry

# 全局设置
yarn config set registry https://registry.npm.taobao.org/

yarn和npm命令对比

npm yarn
npm install yarn
npm install react –save yarn add react
npm uninstall react –save yarn remove react
npm install react –save-dev yarn add react –dev
npm update –save yarn upgrade

Visual Studio Code

打开文件夹，选择项目根目录打开。

Vetur

高亮.vue文件，附带有格式化功能，配合Eslint插件对代码进行格式化检查。

打开 .vue 文件VS Code 会提示安装Vetur插件，如果没有手动安装。

Eslint

**作用：**检查你的js、html、css代码，确保它们符合规范，并且代码风格保持一致性，强制性的规则，你少写一个空格或者多敲一个回车都会被严格的指出来，强迫症的福音，第一次用它的同学可能会抓狂，熟悉后你会感谢它 **使用：**想让插件生效，你的项目还得做一番复杂的配置，好在vue-cli生成的项目帮我们把配置都生成好了，你也不必修改什么规则，直接用就行，在使用vue-cli生成webpack项目时会询问你是否启用eslint并且使用哪套规范，选择Standard规范就行

自动在你的项目根目录下生成.eslintignore和.eslintrc.js两个配置文件，package.json文件里增加eslint的相关依赖

Command+, (Code - Performances - Settings) 点击右上角的 {}

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

{
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        {
            "language": "vue",
            "autoFix": true
        }
    ],
    "eslint.autoFixOnSave": true,
    "vetur.format.defaultFormatter.js": "vscode-typescript",
    "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
    "editor.formatOnSave": true,
    "editor.tabSize": 2,
}

1
2

# 在 VS Code 的终端中
npm run dev

Debugger for Chrome

找到“扩展”或者按快捷键“Ctrl+Shift+X”，如下图，输入Debugger for Chrome查找，并安装。

1
2

运行npm run dev后，打开Chrome 连接访问项目
在VS Code中点击Attach to Chrome启动调试，设置调试断点即可进行调试
更新于 2022-01-17
 node.js
返回 | 主页