LoginSignup
5
4

More than 5 years have passed since last update.

WebStormで起動タスクを設定する方法

Last updated at Posted at 2016-04-12

WebStormにはプロジェクト起動時のタスクを設定する機能があります。
ひとまず例として、次のような「hello」と表示するnpm scriptをプロジェクトを開いた時に実行するようにする設定方法を書きます。

package.json
{
  "name": "webstorm_test",
  "version": "0.1.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "hello" : "echo 'hello'"
  },
  "author": "nyamogera",
  "license": "MIT"
}
  1. 設定用のダイアログを開く。

    • Windowsの場合メニューの[File]→[Settings]で[Settings]ダイアログを開く
    • OS Xの場合 - メニューの[WebStorm]→[Preferences]で[Preferences]パネルを開く
  2. [Tools]→[Startup Tasks]から[+]ボタンを押し、[Add New Configration]を選択する。

  3. 一番下の[npm]を選択し、[Run/Debug Configration]ダイアログを開きます。

  4. [Run/Debug Configration]ダイアログの設定

    • [Name]に適当な名前を入れる。
    • [Scripts]でドロップダウンの[▼]ボタンからnpm script名を選択します。ここでは「hello」です。
  5. 設定が完了したら、[Apply]ボタンを押し、[OK]ボタンを押してダイアログを閉じます。

これで、現在のプロジェクトを開いているWebStormを一度終了して再度プロジェクトを開きなおすと、「hello」スクリプトが実行されます。

まとめ

今回は単純に「hello」と表示されるだけのものを実行してみました。実際は毎回初めに実行するような「watch」タスクなどの設定するといよいでしょう。
また、実際に手順を実行した人はわかると思いますが、「Grunt」「Gulp」「Mocha」他、npm scripts以外の起動タスクも設定できます!
WebStormを使って快適にWeb開発を行って行きましょう。

他にもわりと高頻度で使う便利なWebStormの使い方を記事にまとめました。こちらも参照していただけたら幸いです。

参考にした記事

5
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
4