kaughtup
5/15/2018 - 3:52 AM

node browserSync

npm初期化とbrowserSyncインストール

  • ローカルにインストールする例
$ npm init
$ npm install browser-sync --save-dev

インストールが終わったらpackage.jsonのscriptsに1行追加

"start": "browser-sync start --server --files='./*.html, ./*.css'"

package.jsonは以下のようになる

{
  "name": "browsersync",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "browser-sync start --server --files='./*.html, ./*.css'"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "browser-sync": "^2.18.12"
  }
}

実行

$ npm start

別の例として、phpを動かす場合、プロキシ(アパッチとか)を指定する

{
  "name": "test",
  "version": "1.0.0",
  "description": "",
  "main": "index.html",
  "directories": {
    "lib": "lib"
  },
  "scripts": {
    "test": "test",
    // "start": "browser-sync start --server --files='./*.html, ./*.css,./*.js, ./*.php'"
    "start": "browser-sync start --proxy "localhost:80" --files='./*.html, ./*.css,./*.js, ./*.php'"
  },
  "author": "shimizu",
  "license": "ISC"
}