node,npmのお勉強1
普段使ってるけど、あまり詳しくは知らない。軽く調べる。
機能深掘り
npmのあまり知られてない機能 10選 - from scratch
http://yosuke-furukawa.hatenablog.com/entry/2014/06/10/100410
npm shrinkwrap
npm version
npm repo
npm docs
npm dedupe
npm t
npm outdated
david
npm deprecate
npm unpublish
npm xmas
npm config set init.licenseこれはライブラリ作る人は必ず覚えておくと良いコマンドですね。
npm version patchとか npm version minorとかやると以下の事を実行してくれます。
yarn
npmの互換のパッケージマネージャーらしい
Yarnファーストインプレッション - Qiita
http://qiita.com/mizchi/items/1002fde0de10e7c54fb2
--prefer-offline が速い!
君の名は・・YARN! - Qiita
http://qiita.com/endam/items/c77396705e2a158f1952
既に以前パッケージをインストールしたことがあるのであれば、yarn install --prefer-offlineによってサーバーにリクエストせずにオフラインで高速にインストールすることが可能だそうです。
yarn (+ webpack) を使ってみる - Qiita
http://qiita.com/knjname/items/0cc813622e0121c05723
cleanとかpack,upgrade-interactive,whyとか。。
.yarnclean
yarn (+ webpack) を使ってみる - Qiita
http://qiita.com/knjname/items/0cc813622e0121c05723
クローズドなパッケージをnpm install
githubのprivate repositoryをnpmでインストールする - Qiita
http://qiita.com/shinout/items/c6f12d69e68b312d62fa
package.json{ "dependencies": { "<modulename>": "git+https://<token>:[email protected]/<username>/<reponame>#<tagname>" } }
覚えておこう。。
パッケージにして再利用できるようにしておきたいな。。
「npm パッケージ 作成 github - Google 検索」しつつ。。
初めてのnpm パッケージ公開 - Qiita
http://qiita.com/TsutomuNakamura/items/f943e0490d509f128ae2
自分のプログラムの開発が進み、将来的にbeta 版パッケージとlatest パッケージの両方を公開したいと思う時があるかもしれません。
その場合にはnpm tag 機能を使用します。
なるほどー。
3時間でできるnpmモジュール - Qiita
http://qiita.com/cognitom/items/75736e27cc7de151a7d5
いきなりnpmに公開するのは、ちょっと抵抗があったり、なかったり。npmでは、ローカルで開発中のモジュールも、ファイルパスを指定すればインストールできます。ただ、この方法だと--save-devできません。
githubとCI
CircleCIで出来るコト - Qiita
http://qiita.com/noboru_i/items/7d300eb63ae667bf8dc2
プライベートで軽くお試しからがいいので、CircleCIがいいかも。。
GitHubとCircleCIを連携させる - Qiita
http://qiita.com/kooohei/items/4806fdb6b92982e47f81
具体的なチュートリアルとして参考。
Circle CIを使ったNode.jsプロジェクトのテスト - Qiita
http://qiita.com/gaishimo/items/3803d2c997c7c6bdc03d
nodeプロジェクトの例
CircleCI 2.0 で Node.js のテストを試す - Qiita
http://qiita.com/pine613/items/9ddea9ca89a1b51fcba8
2.0でできることが増えたらしい。
CircleCI 2.0は最新版のDockerを使ってdocker buildできる - Qiita
http://qiita.com/ieee0824/items/208ccb1ccd2ea4228ed5
おお、golangのdockerイメージとかでもできるのか。。
テスト
CircleCIの公式サンプルのyarn testでこけた。
TypeScriptのテストをパッと書く / 特に何も入れずにスクレイプのテストをパッと書く – Wano Developers Blog
https://developers.wano.co.jp/typescript%E3%81%AE%E3%83%86%E3%82%B9%E3%83%88%E3%82%92%E3%83%91%E3%83%83%E3%81%A8%E6%9B%B8%E3%81%8F-%E7%89%B9%E3%81%AB%E4%BD%95%E3%82%82%E5%85%A5%E3%82%8C%E3%81%9A%E3%81%AB%E3%82%B9%E3%82%AF/
全然すぐにできなかったけど、若干楽しみつつプロトタイプ設定してみた。
TypeScriptでPromiseを使う – 山本隆の開発日誌
http://www.gesource.jp/weblog/?p=7663
TypeScript 1.5 + ES6 を今すぐ使う方法を調べた - Qiita
http://qiita.com/seanchas_t/items/06e0b859c09953d49845
Babel6でMochaとChaiを使ったテストを書く - Qiita
http://qiita.com/yamadayuki/items/9885c9e126648cd8c5e3
avaのwatch
初めてのnpm パッケージ公開 - Qiita
http://qiita.com/TsutomuNakamura/items/f943e0490d509f128ae2
今回はテスト自動化のava の--watch モードを使用し、ファイルの変更が発生するタイミングで随時テスト行われるようにしながら開発を行っていきたいと思います。
便利そうだー。(electronがたちあがりまくったので、そういう場合には自重。)
avaでのテストの書き方も参考になりそう。
power-assert
TypeScript( or JavaScript ) + mocha + power-assert + espower-typescript 注意点まとめ – Techno Cattleya Blog
https://technocattleya.com/blog/2017/05/27/espower-typescript-notes/
上記のようにすることで、モジュールが全て読み込まれ、TS でも正しくトランスパイルしてくれます。
JS で上記のように書いて、Babel でトランスパイルしても問題ないので、なるべくこの書き方で統一しましょう。
使うかわからないけど、ついつい調べてしまう。。
依存パッケージの更新や脆弱性の確認
Gemnasium
https://gemnasium.com/
オープンソースのためにフリープランがある。
Gemnasium Toolbeltを使うとプライベートレポの権限を与えずに利用できそう。。
自分がプロジェクトで使っているGemの脆弱性チェックしてる? - Qiita
http://qiita.com/macera/items/7d57f0ad20d86ad05ebe
チェックしたいなあ。
babelとtypescirpt
最初にtypescriptが盛り上がり、babelが追い越して2.0になってtypescriptの選択肢が再び、、的な印象。
型指定があるから、学習コストはtypescriptの方が高いかな。
私がTypeScriptについて勘違いしていたこと、そしてその理由 | プログラミング | POSTD
http://postd.cc/i-was-wrong-about-typescript-here-is-why/
言い換えれば、TypeScriptはasync/awaitをサポートしているが、それを全ブラウザで理解可能なECMAScriptにコンパイルすることはできません。
この機能を使わないのであれば、ビルドプロセスからBabelJSを消してしまっても構わないのです。
追記:読者のBirk Skyumが指摘してくれたのですが、この機能のES3へのサポートはTypeScriptのロードマップに存在しており、バージョン2.0でリリースされる予定とのことです。
Babel 6.7 で async/await する - Qiita
http://qiita.com/hashedhyphen/items/44701fcc18bd40066aa7
async/awaitを使いこなせるように。。
今更ながら Babel で ES7 Async/Await を試してみた - Qiita
http://qiita.com/ea54595/items/e6e36fcf1d10deadc17a
npm 開発で再び Babel を導入することにした – アカベコマイリ
http://akabeko.me/blog/2017/04/babel-again/
babelを2017年でつかっている参考記事。
Webpack + Babel 最小構成での環境構築(2017年度6月版) | WEBYA.IN
http://webya.in/blog/2017/06/04/webpack-babel-%E6%9C%80%E5%B0%8F%E6%A7%8B%E6%88%90%E3%81%A7%E3%81%AE%E7%92%B0%E5%A2%83%E6%A7%8B%E7%AF%89%EF%BC%882017%E5%B9%B4%E5%BA%A66%E6%9C%88%E7%89%88%EF%BC%89/
webpack使いやすいよなあ。。
最小構成のES6モジュールを用いたフロントエンド開発環境 - Qiita
http://qiita.com/og24715/items/63d6546ac3a9363228af
babel-preset-env
babel-preset-envを簡単にさわってみた。 - Qiita
http://qiita.com/ryuone/items/13f5d450c3865709ba10
要するに、compat-table(ECMAScript 6 compatibility table)を用いて、サポートされている環境に基づいて必要なBabelプラグインを自動で決定するライブラリということらしいです。
ブラウザ対応をより丸投げできるってことかな。
なるほど。
webpack
webpack初級者から中級者にステップアップするために理解しておきたいプラグインまとめ - Qiita
http://qiita.com/R-Yoshi/items/30282dee7b6d5ddd6622
今どきなオレオレTypeScript開発環境 - Qiita
http://qiita.com/junichi/items/45323a26876332a2473f
【意訳】Webpackの混乱ポイント - Qiita
http://qiita.com/chuck0523/items/caacbf4137642cb175ec
webpack初級者から中級者にステップアップするために理解しておきたいプラグインまとめ - Qiita
http://qiita.com/R-Yoshi/items/30282dee7b6d5ddd6622
hotロードを有効にする
設定ファイルの変更
- devServer設定
- entryにclientを追加
- プラグインを読み込み
- publicPathを設定(ブラウザ上の相対パスで該当スクリプトのありかを示すディレクトリ)
- webpack-dev-serverを使うのが簡単だが、独自サーバーにモジュールを読み込んでも可能
- 古い記述を紹介してる記事があるので注意
- 複数の時については公式
glenjamin/webpack-hot-middleware
のmulti-compiler modeを参照 - webpack公式の英文を読むのも結局近道かも
Express
http://dackdive.hateblo.jp/category/Express
glenjamin/webpack-hot-middleware: Webpack hot reloading you can attach to your own server
https://github.com/glenjamin/webpack-hot-middleware
webpack dev server
https://webpack.github.io/docs/webpack-dev-server.html#hot-module-replacement-with-inline-mode-on-cli
Author And Source
この問題について(node,npmのお勉強1), 我々は、より多くの情報をここで見つけました https://qiita.com/bonk/items/fdd855622571995cd055著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .