javascript grunt란 Grunt, NPM 및 Bower의 차이점(package.json과 bower.json 비교)




grunt란 (2)

나는 npm과 bower를 사용하는 것에 익숙하지 않다. emberjs에서 나의 첫번째 앱을 만든다. :).
나는 레일에 대해 약간의 경험이 있기 때문에 의존 관계를 나열하기위한 파일 아이디어에 익숙하다 (예 : bundler Gemfile)

질문 : package를 추가하고 싶거나 (패키지에 종속성을 체크), package.json 이나 bower.json 에 어디에 속해 있습니까?

내가 모은 것에서,
bower install 을 실행하면 패키지를 가져 와서 /vendor 디렉토리에 넣습니다.
npm install 실행하면 npm install 을 가져 와서 /node_modules 디렉토리에 넣습니다.

이 SO 응답 은 bower가 프런트 엔드를위한 것이며 npm은 백엔드를위한 것임을 말합니다.
Ember-app-kit 는 언뜻보기에이 구별을 고수하고있는 것처럼 보입니다. 그러나 일부 기능을 사용하기위한 gruntfile의 지침에는 두 개의 명시적인 명령이 있으므로 여기서는 완전히 혼란스러워합니다.

직관적으로 나는 그것을 추측 할 것이다.

  1. npm install --save-dev 패키지 이름 은 package-name을 package.json에 추가하는 것과 같습니다.

  2. bower install --save package-namebower.json에 패키지 를 추가하고 bower install을 실행하는 것과 같을 수 있습니까?

그렇다면 패키지를 종속성을 관리하는 파일에 추가하지 않고 명시 적으로 패키지를 설치해야합니까 (명령 줄 도구는 전 세계적으로 설치해야합니까?).


2016 년 중반 업데이트 :

상황이 너무 빨라서 2017 년 말이면이 답변이 더 이상 최신이 아닐 수도 있습니다!

초보자는 빌드 도구 및 워크 플로우를 선택하는 과정에서 빨리 길을 잃을 수 있지만 2016 년에 가장 최신 인 것은 Bower, Grunt 또는 Gulp를 전혀 사용하지 않습니다! Webpack의 도움으로 NPM에서 직접 모든 것을 할 수 있습니다!

나에게 사람들이 다른 워크 플로를 잘못 사용하도록하지 말고 기존 프로젝트에서 GULP를 사용하지만 (천천히 움직이면서), 이것이이 워크 플로우에서 일하는 최고의 회사와 개발자가 많은 돈을 버는 방법입니다!

이 템플릿을 보면 최상의 최신 기술이 혼합 된 최신 설정입니다. https://github.com/coryhouse/react-slingshot

  • 웹팩
  • 빌드 도구 (Gulp, Grunt 또는 Bower 없음)로서의 NPM
  • Redux와의 반응
  • ESLint
  • 목록은 길다. 가서 탐험해라!

당신의 질문:

패키지를 추가 (그리고 git에 종속성 검사)하고 싶다면 package.json 또는 bower.json에 속합니다.

  • 모든 것이 package.json에 속합니다.

  • 빌드에 필요한 종속성은 "devDependencies", 즉 npm install require-dir --save-dev (--save-dev는 devDependencies에 항목을 추가하여 package.json을 업데이트합니다)

  • 런타임 동안 응용 프로그램에 필요한 종속성은 "종속성"( npm install lodash --save (--save는 종속성에 항목을 추가하여 package.json을 업데이트합니다)

그렇다면 패키지를 종속성을 관리하는 파일에 추가하지 않고 명시 적으로 패키지를 설치해야합니까 (명령 줄 도구는 전 세계적으로 설치해야합니까?).

항상 . 그냥 편안함 때문에. 플래그 ( --save-dev 또는 --save )를 추가하면 deps (package.json)를 관리하는 파일이 자동으로 업데이트됩니다. 의존성을 수동으로 편집하여 시간을 낭비하지 마십시오. npm install --save-dev package-name 바로 가기는 npm i -D package-namenpm install --save package-name 바로 가기 npm install --save package-namenpm i -S package-name


Npm과 Bower는 모두 종속성 관리 도구입니다. 그러나 npm은 Node js 모듈을 설치하는 데 사용되지만 bower js는 html, css, js 등과 같은 프런트 엔드 구성 요소를 관리하는 데 사용됩니다 .

더 혼란스러운 사실은 npm이 gruntjshint 같은 프론트 엔드 개발에서도 사용할 수있는 패키지를 제공 jshint 입니다.

이 줄은 더 많은 의미를 더합니다.

Bower는 npm과 달리 주 파일로 간주되는 여러 파일 (예 : .js, .css, .html, .png, .ttf)을 가질 수 있습니다. Bower는 의미 론적으로 이러한 주요 파일을 패키지화하면 구성 요소로 간주합니다.

편집 : 벌레는 Npm과 Bower와 아주 다릅니다. 그런트는 자바 스크립트 작업 주자 도구입니다. 달리 말하면 수동으로해야 할 꿀꿀 거리는 소리를 사용하여 많은 일을 할 수 있습니다. 그 루트 (Grunt) 사용의 일부 강조 :

  1. 일부 파일 압축 (예 : zipup 플러그인)
  2. js 파일에 linting (jshint)
  3. 적은 파일 컴파일 (grunt-contrib-less)

저기 sass 컴파일, 자바 스크립트를 uglifying, 파일 / 폴더를 복사, 자바 스크립트 등 minifying에 대한 불평 플러그인이 있습니다.

grunt plugin은 npm 패키지입니다.

질문 1

패키지를 추가 (그리고 git에 종속성 검사)하고 싶다면 package.json 또는 bower.json에 속합니다.

이 패키지가 어디에 속해 있는지에 따라 다릅니다. 노드 모듈 인 경우 (예 : grunt, request) package.json을 bower json으로 이동합니다.

질문 -2

의존성을 관리하는 파일에 패키지를 추가하지 않고 언제 명시 적으로 패키지를 설치해야합니까?

패키지를 명시 적으로 설치하는지 또는 .json 파일의 종속성을 언급하는지 여부는 중요하지 않습니다. 노드 프로젝트에서 작업하는 중이며 request 이 다른 프로젝트가 필요하다고 가정하면 두 가지 옵션이 있습니다.

  • package.json 파일을 편집하고 'request'에 대한 의존성을 추가하십시오.
  • npm 설치

또는

  • 명령 줄을 사용하십시오 : npm install --save request

--save 옵션은 package.json 파일에도 종속성을 추가합니다. --save 옵션을 지정하지 않으면 패키지 만 다운로드되지만 json 파일은 영향을받지 않습니다.

당신은 어느쪽으로 든 이것을 할 수 있고, 실질적인 차이는 없을 것입니다.





web-frontend