Fork me on GitHub

2016-10-24のJS: npm 4.0.0、Node.js v6.9.0 (LTS)、webpack@2へのマイグレーション

Edit on GitHub 編集履歴を見る

JSer.info #302 - npm 4.0.0がプレリリースされました。

npm install -g npm@4

でインストールすることができます。
npm searchの速度改善、publishライフサイクルがdepreatedとなり、代わりにprepareprepublishOnlyが利用可能になるなど。
npm tagnpm dist-tagとなり、npm outdatedがexit statusを正しく返すなどの変更が含まれています。


Node.js v6.9.0 (LTS)がリリースされました。

6.xのLTS版となり、詳しいサポートスケジュールは以下の記事で解説されています。

Node.js v0.10/v0.12は2016年12月でサポートが終了となり、
Node.js v4.xは2017年4月からメンテンスモードとなります。

また、次の開発版となるNode.js v7.xは10月25日にリリースされる予定です。


Migrating to Webpack 2という記事ではwebpack@2(まだβ版)へのマイグレーション方法について書かれています。

webpackの公式サイトも新しくなりマイグレーションガイドがあるので合わせて読むと良いです。

webpack@2からは設定ファイルのバリデーションが入ったので、おかしな設定をするとエラーになります。
マイグレーション時にエラーが出た場合は上記のガイドを見て直してみると良いです。

細かい記述の変更も多いですが、OccurrenceOrderPluginがデフォルトになったり、コマンドライン引数を取る方法などが追加されていたりもします。

また、ES modulesをそのまま扱うことができるようになっているため、Babelの方でES modulesの変換を行わない設定などについても書かれています。

{
  "presets": [
    ["es2015", { "modules": false }]
  ]
}

ヘッドライン


Release v4.0.0 · npm/npm

github.com/npm/npm/releases/tag/v4.0.0

npm ReleaseNote

npm v4 Preリリース
npm i -g npm@4でインストールができるように、npm searchの速度改善、publishライフサイクルがdepreated、代わりにprepareprepublishOnlyが利用可能に、
npm tagが削除など


Release JSHint 2.9.4 · jshint/jshint

github.com/jshint/jshint/releases/tag/2.9.4

JavaScript Tools ReleaseNote

JSHint 2.9.4リリース。
TDZの対応、重複したエラー報告をしないようになるなど


Ember.js - Ember.js 2.8-LTS, 2.9 and 2.10 Beta Released

emberjs.com/blog/2016/10/17/ember-2-9-released.html

JavaScript library ReleaseNote

Ember.js 2.8-LTS、2.9、2.10β リリース。
2.8-LTSでは2018年2月までセキュリティパッチがリリースされる。


flux/CHANGELOG.md at 3.1.0 · facebook/flux

github.com/facebook/flux/blob/3.1.0/CHANGELOG.md

facebook Flux library ReleaseNote

Facebook/flux 3.0.0リリース。
FluxMapStoreを削除


Chromium Blog: Chrome 55 Beta: Input handling improvements and async/await functions

blog.chromium.org/2016/10/chrome-55-beta-input-handling.html

Chrome ReleaseNote

Chrome 55 Betaリリース。
Pointer Events、async/await、CSS hyphens、Persistent Storageのサポートなど
corss originでかつ2G回線におけるdocument.writeをブロックするようになるなど


Node v6.9.0 (LTS) | Node.js

nodejs.org/en/blog/release/v6.9.0/

node.js ReleaseNote

Node.js v6.9.0 (LTS)リリース。
Node.js v4.x (LTS)からのマイグレーションガイドも書かれている。
v6.xは2018年4月までアクティブなLTSとなる。


アーティクル


Node.js v6 Transitions to LTS – Medium

medium.com/@nodejs/node-js-v6-transitions-to-lts-be7f18c17159

node.js

Node.js v6以降のLTSスケジュールについて
Node.js v0.10/v0.12は2016年12月でEOLとなる。


auxclick is Coming to Chrome 55 | Web | Google Developers

developers.google.com/web/updates/2016/10/auxclick

Chrome JavaScript

左クリック以外に反応するclicKイベントであるauxclickイベントについて。


Once Upon an Event Listener | Web | Google Developers

developers.google.com/web/updates/2016/10/addeventlistener-once

JavaScript DOM

HTMLElement#addEventListener{once}オプションについて。
一度のみハンドリングするハンドラを指定できる


Migrating to Webpack 2

javascriptplayground.com/blog/2016/10/moving-to-webpack-2/

webpack document

webpack@1から@2へのマイグレーションについて


Async functions - making promises friendly | Web | Google Developers

developers.google.com/web/fundamentals/getting-started/primers/async-functions

JavaScript

async/awaitについて。
sequentialとparallelな書き方の違いについてサンプルコードと共に解説してる


Tips for using async functions (ES2017)

www.2ality.com/2016/10/async-function-tips.html

JavaScript

async/awaitの細かな注意点について。
asyncの動作、awaitを忘れた場合の動画、await Promise.all()、コールバックとasync、unhandled rejectionについて


TestCafeでブラウザの自動テスト(E2Eテスト) | Web Scratch

efcl.info/2016/10/23/testcafe/

JavaScript browser testing E2E

ブラウザの自動テストフレームワークであるTestCafeの使い方についての解説。
設定レスで動作する仕組み、リモートテスト、テストコードについて


Syntax: language agnostic parser generator – Medium

medium.com/@DmitrySoshnikov/syntax-language-agnostic-parser-generator-bd24468d7cfc

JavaScript library

言語を問わないagnosticなパーサ、ジェネレータツールキット


Pragmatic, Practical, and Progressive Theming with Custom Properties – CSS Wizardry – CSS, OOCSS, front-end architecture, performance and more, by Harry Roberts

csswizardry.com/2016/10/pragmatic-practical-progressive-theming-with-custom-properties/

CSS

CSS Custom Propertyを使ったテーマの実装


スライド、動画関係


Polymer Summit 2016 - YouTube

www.youtube.com/playlist?list=PLNYkxOF6rcICc687SxHQRuo9TVNOJelSZ

JavaScript WebComponents イベント

Polymer Summit 2016の動画一覧


サイト、サービス、ドキュメント


A JavaScript library for building user interfaces - React

facebook.github.io/react/

Reactのドキュメントが新しくなった。
Codepenでサンプルを実行できるように


jsPerf: JavaScript performance playground

jsperf.com/

JavaScript performance webservice

JavaScriptスニペットのパフォーマンス計測サービスであるjsPerfのリニューアル公開


ソフトウェア、ツール、ライブラリ関係


beautify-web/js-beautify · GitHub

github.com/beautify-web/js-beautify

JavaScript Tools

JavaScriptを整形できるツールとサイト。 .jsbeautifyrcで設定を管理できる


jgraph/mxgraph: mxGraph is a fully client side JavaScript diagramming library

github.com/jgraph/mxgraph

JavaScript SVG library

draw.ioで使われているSVGの作図ライブラリ。


Automated browser testing for the modern web development stack | TestCafe

devexpress.github.io/testcafe/

JavaScript testing E2E

設定なしで使える自動テストフレームワーク。
Seleniumを使わないので単独で動作する。
Babelを内蔵しasync/awaitなどを扱え、自動的に一定時間待つなどの仕組みを持っている。


Hyperform - Capture form validation back from the browser

hyperform.js.org/

JavaScript library

HTML5 form validation APIをpolyfill/置き換える実装を持つフォームバリデーションライブラリ


書籍関係


JavaScript フレームワーク入門 : 掌田津耶乃 : 本 : Amazon.co.jp

www.amazon.co.jp/JavaScript-%E3%83%95%E3%83%AC%E3%83%BC%E3%83%A0%E3%83%AF%E3%83%BC%E3%82%AF%E5%85%A5%E9%96%80-%E6%8E%8C%E7%94%B0%E6%B4%A5%E8%80%B6%E4%B9%83/dp/4798047848

JavaScript library book

TypeScript、npmとBower、webpack、jQuery、Vue.js、Backbone.js、Angular、React、AureliaなどのJavaScriptの色々なツールやフレームワークについての本


この記事へ修正リクエストをする
記事を紹介する