> 웹 프론트엔드 > JS 튜토리얼 > NPM의 유용한 팁과 요령은 무엇입니까?

NPM의 유용한 팁과 요령은 무엇입니까?

清浅
풀어 주다: 2019-01-21 17:49:31
원래의
4249명이 탐색했습니다.

NPM에서 단 하나의 명령을 실행하여 여러 모듈을 설치하고, 패키지 정보를 가져오고, 특정 버전의 패키지를 설치하고, 종속성 목록을 나열할 수 있습니다. 유용한 팁과 요령

일일 NPM에 있는 경우 이 글에서 소개한 팁과 요령이 여러분에게 도움이 될 것이라고 믿습니다

NPM의 유용한 팁과 요령은 무엇입니까?

[추천 강좌: node.js 강좌]

[추천 글: What npm, npm 설치 및 구성 방법

Generate package.json

보통 npm init을 실행한 후 npm에서 요청한 정보를 추가하기 시작합니다. 그러나 이 모든 정보에 신경 쓰지 않고 기본값을 유지하려면 npm 요청의 모든 데이터 조각에 대해 Enter 키를 누릅니다. 이를 방지하려면 npm init -y를 입력하면 됩니다. 이렇게 하면 질문하는 것을 건너뛸 수 있습니다.

참고: 동일한 효과를 갖는 npm init --yes를 사용할 수도 있습니다.

모듈 설치

npm install 대신 더 간단한 npm i를 사용할 수 있습니다.

한 번에 여러 모듈 설치

각 모듈에 대해 npm install 명령을 입력할 필요가 없습니다. 예:

bash 코드:
npm i gulp-pugnpm i gulp-debugnpm i gulp-sass
로그인 후 복사

명령 하나만 실행하면 모든 모듈을 한 번에 설치할 수 있습니다. :

bash 코드:
npm i gulp-pug gulp-debug gulp-sass
로그인 후 복사

더 쉬운 방법도 있습니다. 모든 이름이 동일한 접두어로 시작하면 전체 이름을 입력할 필요가 없습니다.

bash 코드:
npm i gulp{-debug,-sass,-pug}
로그인 후 복사

설치 바로가기 사용 flags

패키지를 설치하고 프로덕션 종속성으로 저장하려면 일반적으로 이 작업을 수행합니다.

bash 코드:
npm i gulp --save-prod
로그인 후 복사

다음과 같이 -P 단축키를 사용할 수 있습니다.

bash 코드:
npm i gulp -P
로그인 후 복사

개발의 경우 종속성에도 동일하게 적용됩니다. 전체 --save-dev 플래그를 입력할 필요가 없으며 다음과 같이 -D 단축키를 사용할 수 있습니다.

bash 코드:
npm i gulp -D
로그인 후 복사

기본적으로 아무 것도 없이 실행할 때 플래그(인수) npm install 시 npm은 패키지를 package.json 파일에 대한 종속성으로 추가합니다. 이를 방지하려면 다음과 같이 --no-save 플래그(매개변수)를 사용하여 설치하십시오.

bash 코드:
npm i gulp --no-save
로그인 후 복사

패키지 정보 가져오기

다음 명령은 vue 패키지의 관련 정보를 표시합니다.

npm view vue 또는 npm v vue

npm 获取包信息

최신 버전의 패키지를 얻으려면 다음 명령을 사용해 보세요.

bash 코드:
> npm v vue version> 2.5.17
로그인 후 복사

전체 버전 목록을 얻으려면 npm 패키지 중 복수형을 사용해 보세요.

bash 코드:
> npm v vue versions> [ '0.0.0',  '0.6.0',  '0.7.0',  ...  '2.5.15',  '2.5.16',  '2.5.17-beta.0',  '2.5.17' ]
로그인 후 복사

특정 버전의 패키지 설치

최신 버전의 패키지 대신 다른 버전을 설치하려면 다음을 입력하세요.

bash 코드:
npm i vue@2.5.15
로그인 후 복사

숫자보다 쉬운 메모리 이름이 주어지면(적어도 나에게는) dist-tag 이름 목록을 사용하고 npm v 명령을 실행하여 다음과 같이 목록을 얻을 수 있습니다.

bash 코드:
npm i vue@beta
로그인 후 복사

패키지 검색

때때로 자신이나 친구들이 얼마 전에 추천했던 패키지의 정확한 이름이 기억나지 않을 때가 있습니다. 이 경우 npm 검색을 사용하여 터미널에서 직접 검색을 수행할 수 있습니다.

bash code:
npm search gulp debug
로그인 후 복사

또는

bash code:
npm s gulp debug
로그인 후 복사

이렇게 하면 설명, 작성자 및 기타 정보가 포함된 패키지 목록이 인쇄됩니다.

npm 搜索结果

패키지 제거

package.json 파일을 열고 수동으로 종속성을 제거하지 않으려면 다음 명령을 사용하여 제거할 수 있습니다.

bash 코드:
npm uninstall vue
로그인 후 복사

This node_modules 폴더와 package.json 파일에서 패키지를 제거합니다. 물론 rm, un 또는 r을 사용하여 동일한 효과를 얻을 수 있습니다. 예:

bash 코드:
npm rm vue
로그인 후 복사

어떤 이유로 node_modules 폴더에서 패키지 파일을 제거하고 싶지만 여전히 그대로 유지하는 경우 dependency package.json 파일에 저장되면 --no-save 매개변수를 사용할 수 있습니다:

bash 코드:
npm rm vue --no-save
로그인 후 복사

List dependency

프로젝트 종속성 목록을 보려면

bash를 사용할 수 있습니다. code:
npm ls
로그인 후 복사

이것은 package.json 파일의 모든 종속성과 모든 종속성을 나열합니다. 종속성을 나열하고 싶다면 다음을 수행할 수 있습니다.

bash 코드:
npm ls --depth=0
로그인 후 복사

这将打印出这样的东西:

bash 代码:
├── jquery@3.3.1├── vue@2.5.17└── yarn@1.12.3
로그인 후 복사

当然,如果要查看所有全局安装的包的列表,可以使用 -g 标志

bash 代码:
npm ls -g -depth 0
로그인 후 복사

运行测试

你可以使用 npm run tests 运行测试,但你可以用 npm test 甚至更简短的 npm t 代替。

显示可用的 script

有时,我们希望查看 package.json 文件中包含的脚本。 我们当然可以打开 package.json 文件,但我们也可以这样做:

bash 代码:
npm run
로그인 후 복사

如果在 package.json 文件中有这样的配置,如下所示:

bash 代码:
"scripts": {  "test": "jest",  "build": "gulp build"}
로그인 후 복사

那么 npm run 命令将显示以下内容:

bash 代码:
Lifecycle scripts included in npm:  test    jestavailable via `npm run-script`:  build    gulp-build
로그인 후 복사

从 Github 仓库安装 package(包)

你可以直接从 Github 仓库安装一个包:

bash 代码:
npm i https://github.com/sindresorhus/gulp-debug
로그인 후 복사

或者你可以省略域名部分

bash 代码:
npm i sindresorhus/gulp-debug
로그인 후 복사

打开包的 Github 页面

你当然可以通过 Google 搜索,然后查找该页面,或者你可以执行以下操作:

bash 代码:
npm repo create-react-app
로그인 후 복사

无需安装软件包即可执行上述命令。

列出所有可用的 NPM 环境变量

你可以通过运行以下命令来查看可供我们使用的 NPM 变量的完整列表:

bash 代码:
npm run env | grep npm_
로그인 후 복사

上面的命令将打印如下内容:

bash 代码:
npm_config_fetch_retry_maxtimeout=60000npm_config_tag_version_prefix=vnpm_config_strict_ssl=truenpm_config_sso_type=oauth...
로그인 후 복사

这些变量的好处是它们可以在你的脚本中使用,你甚至可以创建自己的 NPM 环境变量,让我们看看如何创建。

添加自己的 NPM 变量

你可以通过向 package.json 文件添加自己的 NPM 变量。 它可以是任何 key,但我更喜欢将所有 NPM 变量放在 config key 中,以保持结构有序。 像这样:

bash 代码:
"config": {   "build_folder":"./dist" }
로그인 후 복사

现在,如果你使用前面讨论的命令 npm run env | grep npm_ 列出你的变量,你会看到你的新变量在那里:

bash 代码:
npm_package_config_build_folder=./distnpm_config_fetch_retry_maxtimeout=60000npm_config_tag_version_prefix=vnpm_config_strict_ssl=truenpm_config_sso_type=oauth...
로그인 후 복사

默认情况下,npm 会将你的变量命名以 npm_package 为前缀,并保持其在 package.json文件中的结构,即 config_build_folder 。

在 NPM script 中使用 NPM 变量

一旦你看到了完整的变量列表,并且你希望在 script 中使用这些变量中的任何一个的值,那么你就可以在 package.json 中执行此操作(请参阅上一节中变量 npm_package_config_build_folder 的值)

bash 代码:
"scripts": {  "build": "gulp build --dist $npm_package_config_build_folder"}
로그인 후 복사

一旦你用 npm run build 运行这个命令,它将被执行为

bash 代码:

gulp build --dist ./dist
로그인 후 복사

总结:以上就是有关NPM 的一些有用的提示和技巧,希望对大家有所帮助。




위 내용은 NPM의 유용한 팁과 요령은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
npm
원천:html.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿