読者です 読者をやめる 読者になる 読者になる

tyoshikawa1106のブログ

- Force.com Developer Blog -

NPM:ローカルサーバー起動の環境構築メモ

HTMLとJSファイルでちょっとしたサンプルコードを動かすときにnpmだけでローカルサーバを起動する方法はどうすればいいのかなと検索したところ、Qiitaにわかりやすい解説が投稿されていました。

自分で試した時に忘れてエラーになったところ

package.xml作成後にscriptsのstartでhttp-serverを起動するようにします。

{
  "name": "app",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "http-server -o"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "http-server": "^0.9.0"
  }
}


これでnpm startするとサーバーが起動します。
f:id:tyoshikawa1106:20160802080209p:plain


こんな感じでindex.html以外も表示できます。
f:id:tyoshikawa1106:20160802080247p:plain

別の方法

$ mkdir app
$ cd app
$ npm init
$ npm install express --save
$ mkdir public
$ touch public/index.html
$ touch server.js


package.xmlの内容

{
  "name": "app",
  "version": "0.0.0",
  "description": "",
  "main": "server.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}


server.jsの内容。

var express = require('express');
var app = express();
var port = process.env.PORT || 8080;

// Serve static files
app.use(express.static(__dirname + '/public'));

// Serve your app
console.log('Served: http://localhost:' + port);
app.listen(port);


npm startで同じように表示できます。準備が少し大変だけどHerokuとかで動かしたいときはこっち。