Fork me on GitHub

2018-01-02 JS: npm의 패키지 명 규칙 변경, gulp 4.0.0 프리릴리즈, Babel 7의 변경 예정 사항

Translator: U-Yeong Ju Edit on GitHub See Revisions

JSer.info #364 - The npm Blog — New Package Moniker rules에는 변경된, npm이 허용하는 패키지 이름 규칙에 대해 작성돼 있습니다.

지금까지는 패키지 이름에 ., _, -를 사용시 이를 구별하고 각기 다른 패키지로 허용하고 있었습니다.
하지만, 이제부터 ., _, -는 계속 사용할 수는 있지만 이를 각기 다른 패키지로 구별하지 않습니다.

예를들어 react-native라는 패키지가 npm에 이미 공개된 경우에 아래와 같은 이름의 패키지는 발행(publish)할 수 없습니다.

  • reactnative
  • react_native
  • react.native

이로 인해 패키지 이름으로 사용할 수 있는 것은 줄어드는 대신, 현재 Scoped module(@user/package)로 이름 공간을 나눌 수 있으므로 이를 사용하여 계속해서 원하는 이름으로 패키지를 발행할 수 있습니다.


gulp 4.0.0가 프리 릴리즈됐습니다.
다음과 같이 @next를 지정하여 설치할 수 있습니다.

npm install gulp@next

gulp.reset 삭제이 삭제됐고 gulp.task의 인수가 변경됐습니다. 또, gulp.seriesgulp.parallel, gulp.tree, gulp.registry가 추가됐습니다.

지금까지는 gulp.task의 두 번째 인수로 의존하고 있는 태스크를 정의했습니다.

gulp.task('default', ['del'], function() {
    // default task code here
});

gulp 4.0.0부터는 gulp.series 등을 사용해 의존하는 태스크를 정의합니다.

gulp.task('default', gulp.series('del', function() {
    // default task code here
}));

자세한 내용은 문서에 공개돼 있습니다.

현재 위 문서 업데이트도 함께 이뤄지고 있습니다. gulp 4의 정식 릴리즈는 공식 문서가 수정되고 마이그레이션 가이드 등이 준비되면 이뤄질 거 같습니다.


Nearing the 7.0 Release · Babel에는 곧 릴리즈 될 Babel 7의 변경 사항에 대해 작성돼 있습니다.

Babel 플러그인이 최신 ECMAScript 사양에 맞춰 수정되며 @babel/*와 같이 Scoped module로 변경됩니다. 변경된 ECMAScript Proposal에 관한 패키지의 이름 규칙에 대해 작성돼 있습니다.

또, 지난 Planning for 7.0 · Babel에서 변경된 사항에 대해서도 작성돼 있습니다. 당시에는 Deprecate env option in .babelrc에 따라 env 옵션을 비권장할 예정이였지만 이 변경은 철회됐습니다.
아울러 지금까지는 class MyArray extends Array{}와 같은 내장 객체의 상속이 이뤄지지 않았지만 Add support for extending builtins에 의해 앞으로 지원됩니다.


헤드라인


The npm Blog — New Package Moniker rules

blog.npmjs.org/post/168978377570/new-package-moniker-rules

npm news security

npm에 패키지를 발행 규칙이 변경됐습니다.
패키지 명에 포함되는 .-_ 문자를 각기 다른 패키지로 구별하지 않습니다.
이는 오타를 노린 유사 패키지 발행을 방지할 목적으로, react-nativereact.native를 같은 패키지로 취급합니다.


Introducing Hyperapp 1.0 🎉 – Jorge Bucaran – Medium

medium.com/@JorgeBucaran/introducing-hyperapp-1-0-dbf4229abfef

JavaScript library ReleaseNote

hyperapp 1.0.0이 릴리즈됐습니다.


Release v4.0.0 · gulpjs/gulp

github.com/gulpjs/gulp/releases/tag/v4.0.0

gulp ReleaseNote

gulp 4.0.0이 프리릴리즈 됐습니다. npm install gulp@next 명령어로 설치할 수 있습니다.
gulp.reset이 삭제 됐고 gulp.task의 세 번째 인수가 삭제됐으며 gulp.seriesgulp.parallel, gulp.tree, gulp.registry가 추가됐습니다. 또, gulpgulp-cli로 패키지가 분리됐습니다.


Ember.js - Ember 2.18 and 3.0 Beta Released

emberjs.com/blog/2018/01/01/ember-2-18-released.html

Ember ReleaseNote

Ember 2.1.8과 3.0β가 릴리즈됐습니다.
Ember 3.0에서는 IE 9, 10의 지원을 종료하고 2.x에서 비권장된 기능이 삭제됩니다. 삭제된 기능은 ember-2-legacy 애드-온에 포팅됩니다.


Neutrino: Releasing v8 🎉 – Eli Perelman – Medium

medium.com/@eliperelman/neutrino-releasing-v8-a643f356f410

JavaScript Tools ReleaseNote

JavaScript의 개발 환경 셋업 도구 Neutrino v8.0.0이 릴리즈 됐습니다.
Scoped module을 사용해 @neutrinojs로 패키지를 이동시켰으며 @neutrinojs/library 등의 코어 미들웨어가 추가됐습니다. 또, 복수 페이지로 이뤄진 애플리케이션애 대한 개발 환경도 대응합니다.


아티클


Performance Calendar » Performance insurance

calendar.perfplanet.com/2017/performance-insurance/

performance Tools JavaScript browser

성능과 관련된 도구를 소개하는 글입니다.
파일 사이즈 검사 도구, 파일 분리 검사 도구, LightHouse, 모니터링 서비스 등 다양한 도구를 소개합니다.


Christmas Gifts for Your Future Self: Testing the Web Platform ◆ 24 ways

24ways.org/2017/testing-the-web-platform/

WebPlatformAPI testing article browser

상호 운용성 검증을 위한 테스트에 관해 작성돼 있습니다.
Web Platform Tests의 테스트 관점과 컨트리뷰팅 방법 그리고 테스트 작성 방법에 대해 소개합니다.


Nearing the 7.0 Release · Babel

babeljs.io/blog/2017/12/27/nearing-the-7.0-release

babel article

Babel 7의 변경 사항에 대해 작성돼 있습니다.


ResizeObserver를 이용한 변경 감지와 Element Query | blog.jxck.io(일본어)

blog.jxck.io/entries/2017-12-30/resize-observer-and-element-query.html

WebPlatformAPI JavaScript

ResizeObserver에 대한 소개 글입니다.
요소의 크기 변경을 감지하는 Observer API에 대해 작성돼 있습니다.


Profiling adventure - Qiita(일본어)

qiita.com/martinheidegger/items/5a5c40770ef6f47a92b2

node.js performance debug article

Node.js에서 perf_hooks을 사용한 프로파일링 방법에 대해 작성돼 있습니다. Node.js의 --prof 플러그를 사용한 보다 상세한 덤프 데이터를 얻는 방법을 소개합니다. 또, --inspect-brk로 Chrome의 개발자 도구를 사용해 디버깅하는 방법도 이야기 합니다.


JavaScript의 쓰레드 병렬 실행 환경(일본어)

nhiroki.jp/2017/12/10/javascript-parallel-processing

Chrome JavaScript webworker article

JavaScript 쓰레드와 관련된 각 개념과 API에 대해 작성돼 있습니다.
테스트 큐, Web Worker 모델, 쓰레드 간 메시징, 데이터의 복사와 전이(Transferable), SharedArrayBuffer, Agent의 공유 메모리 모델, Worklet/Tasklet, Web Locks, Thread API에 대해 자세하게 작성돼 있습니다.


Getting Started with Jest and Puppeteer – Noteworthy — The Journal Blog

blog.usejournal.com/getting-started-with-jest-and-puppeteer-7cf6c59a2cae

JavaScript Chrome E2E testing

Jest와 Puppeteer를 사용한 테스트 환경 설정과 테스트 작성 방법에 대해 작성돼 있습니다.


사이트, 서비스, 문서


tbfleming/cib: clang running in browser (wasm)

github.com/tbfleming/cib/

JavaScript WebAssembly Clang C++

clangclang-format을 JavaScript로 컴파일 하여, 브라우저 상에서 clang을 사용해 C++을 WebAssembly 컴파일하고 실행할 수 있는 데모입니다.


소프트웨어, 도구, 라이브러리


anseki/leader-line: Draw a leader line in your web page.

github.com/anseki/leader-line

JavaScript SVG library

특정 요소들을 화살표로 연결하거나 특정 요소에 대한 화살표와 캡션 등을 SVG로 그릴 수 있는 라이브러리입니다.


whoeverest/wsrun: Command runner for Yarn workspaces. Dependency aware.

github.com/whoeverest/wsrun

yarn Tools

Yarn workspace 용 도구로 lerna run 처럼 각각의 패키지에 대한 명령을 실행할 수 있습니다.


keithamus/sort-package-json: Sort an Object or package.json based on the well-known package.json keys

github.com/keithamus/sort-package-json

Tools node.js

package.json의 필드를 정렬하는 도구입니다.


도서


JavaScript의 쓰레드 병렬 실행 환경(일본어)

nhiroki.jp/2017/12/10/javascript-parallel-processing

Chrome webworker JavaScript

JavaScript에서의 WebWorker와 SharedWorker, Worklet 등의 쓰래드 구조와 차이점에 대해 작성돼 있습니다.
또, 검토되고 있는 Web Locks API와 Thread API에 대해서도 이야기합니다.


Pull Request to this article
JSer.info Slackに参加する