반응형
[JavaScript] gulp
Gulp? Javascript ToolKit. 빌드 자동화 툴. 여러 플러그인을 통해 css, javascript등 경량화(minify) 해줌.
즉, 간단히 말해서
이전엔 scss 를 만들면 html이 바로 못 읽으니깐, 특정 툴을 이용해서 css로 변환(컴파일)해서 넣어줬는데,
gulp + 플러그인을 이용하면 자동으로 scss 를 css로 바꿔서 특정 폴더 안에 넣어준다.
역할 (참고)
- 자동으로 자바스크립트 라이브러리, 서드파티 앱등을 모으고 축소, 압축을 수행
- 자동으로 단위 테스트(Unit Test) 수행
- 자동으로 LESS / CSS 컴파일링
- 자동으로 node.js 브라우저 Refresh를 도와줌
설치
Gulp 공식 사이트에 설치 방법대로
$ npm install --save-dev gulp
그런데 VSCode 터미널에서 설치하려니깐 안됨...
아래 명령어 다 안됨...
$ npm install --save-dev gulp $ npm install -g gulp $ npm install gulp
D:\Project>npm install --save-dev gulp npm notice save gulp is being moved from dependencies to devDependencies npm WARN workorder@1.0.0 No repository field. npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}) + gulp@4.0.1 added 1 package from 1 contributor, updated 1 package, moved 1 package and audited 6681 packages in 5.049s found 0 vulnerabilities D:\Project>gulp --version 'gulp'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다.
CMD를 관리자 모드로 열어서 실행하면 된다.
npm 으로 설치 안 될 때는 그냥, 관리자 모드로 실행하면 거의 다 설치 된다.
C:\WINDOWS\system32>npm install -g gulp C:\Users\itinerant\AppData\Roaming\npm\gulp -> C:\Users\itinerant\AppData\Roaming\npm\node_modules\gulp\bin\gulp.js npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\gulp\node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}) + gulp@4.0.1 added 317 packages from 218 contributors in 6.983s C:\WINDOWS\system32>gulp --version CLI version: 2.2.0 Local version: Unknown
반응형
'WEB > JavaScript' 카테고리의 다른 글
[JavaScript] image refresh 오류 (0) | 2019.05.09 |
---|---|
[JavaScript] textarea 줄 수 제한 (Limit number of lines in textarea) (0) | 2019.05.07 |
[Javascript] Learning Javascript (진행중) (0) | 2019.05.01 |
[JavaScript][ES6] Did you forget to signal async completion? 오류 해결 방법 (0) | 2019.04.24 |
[JavaScript] css style 제거 하는 방법 (0) | 2019.04.09 |