memo.log

技術情報の雑なメモ

npm の勉強メモ（4）

概要

npm でインストールしたライブラリ(lodash)をTypeScriptから使う
Webブラウザからのリクエストで実行する

手順

前提

分かりやすいようまっさらの環境から構築してみる

手順

# はコメントメモ

# 初期化
% npm init
# TypeScript インストール
% npm install --save-dev
#  lodash をインストール
% npm install --save-dev lodash
# TypeScript で使うためにこちらもインストールが必要みたい
# 型定義ファイルと呼ばれるもののようだが深入りはしていない
% npm install --save-dev @types/lodash
# ブラウザからは require できないので、一つのjsファイルにまとめるためのライブラリ
% npm install --save browserify
# TypeScript ファイルを準備
% cat main.ts
import _ = require("lodash");

console.log(_.isString("abc"));

# TypeScript を.jsにトランスパイル
# build ディレクトリ内にファイルができる
% node_modules/.bin/tsc -d main.ts --outDir build
# jsファイルを1つにまとめる。requireしているライブラリ（lodash）ごと一つになる。
% node_modules/.bin/browserify build/main.js -o bundle.js
# ↓例えばこんなんで動作確認
% cat index.html
<!DOCTYPE html>
<html>
  <head>
    <title>Main</title>
  </head>
  <body>
  </body>
  <script src="bundle.js"></script>
</html>

% sudo ruby -rwebrick -e 'WEBrick::HTTPServer.new(:DocumentRoot => "./", :Port => 80).start'
````