LoginSignup
139
133

More than 3 years have passed since last update.

AtomでTypeScriptの環境を構築する

Last updated at Posted at 2015-07-09

TypeScriptのプラグインをインストール

atom-typescriptをインストール

atom-typescript
https://github.com/TypeStrong/atom-typescript

ターミナルで以下のコマンドを入力
インストールに結構時間がかかるので気長に待ってください。

$ apm install atom-typescript

プロジェクトのルートにtsconfig.jsonファイルを作成

tsconfig.jsonにjsにコンパイルする際の設定を記述します。
compileOnSaveをtrueに指定すると、保存と同時にjsファイルにコンパイルしてくれます。gulpやgruntで自動コンパイルする場合は、falseにしてください。

tsconfig.json
{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "declaration": false,
    "noImplicitAny": false,
    "removeComments": false,
    "noLib": false,
    "preserveConstEnums": true,
    "suppressImplicitAnyIndexErrors": true
  },
  "formatCodeOptions": {
    "indentSize": 4,
    "tabSize": 4,
    "newLineCharacter": "\r\n",
    "convertTabsToSpaces": true,
    "insertSpaceAfterCommaDelimiter": true,
    "insertSpaceAfterSemicolonInForStatements": true,
    "insertSpaceBeforeAndAfterBinaryOperators": true,
    "insertSpaceAfterKeywordsInControlFlowStatements": true,
    "insertSpaceAfterFunctionKeywordForAnonymousFunctions": true,
    "insertSpaceAfterOpeningAndBeforeClosingNonemptyParenthesis": false,
    "placeOpenBraceOnNewLineForFunctions": true,
    "placeOpenBraceOnNewLineForControlBlocks": true
  },
  "compileOnSave": true,
  "filesGlob": [
    "./**/*.ts",
    "!./node_modules/**/*.ts",
    "!./bower_components/**/*.ts",
    "!./typings/**/*.ts"
  ],
  "files": [
    "./test.ts"
  ]
}

構文チェック

Linterをインストール

Linter
https://github.com/AtomLinter/Linter

ターミナルで以下のコマンドを入力

$ apm install linter

tslintをインストール

tslint
https://github.com/palantir/tslint

ターミナルで以下のコマンドを入力

$ npm install -g tslint
$ apm install linter-tslint

プロジェクトのルートにtslint.jsonファイルを作成

tslint.jsonにtypescriptを構文チェックする各種設定を記述します。

tslint.json
{
  "rules": {
    "class-name": true,
    "curly": true,
    "eofline": false,
    "forin": true,
    "indent": [true, "spaces"],
    "label-position": true,
    "label-undefined": true,
    "max-line-length": [true, 140],
    "no-arg": true,
    "no-bitwise": true,
    "no-console": [true,
      "debug",
      "info",
      "time",
      "timeEnd",
      "trace"
    ],
    "no-construct": true,
    "no-debugger": true,
    "no-duplicate-key": true,
    "no-duplicate-variable": true,
    "no-empty": true,
    "no-eval": true,
    "no-string-literal": false,
    "no-switch-case-fall-through": true,
    "no-trailing-comma": true,
    "no-trailing-whitespace": true,
    "no-unused-expression": true,
    "no-unused-variable": true,
    "no-unreachable": true,
    "no-use-before-declare": true,
    "one-line": [true,
      "check-open-brace",
      "check-catch",
      "check-else",
      "check-whitespace"
    ],
    "quotemark": [true, "single"],
    "radix": false,
    "semicolon": true,
    "triple-equals": [true, "allow-null-check"],
    "variable-name": false,
    "whitespace": [true,
      "check-branch",
      "check-decl",
      "check-operator",
      "check-separator",
      "check-type"
    ]
  }
}
139
133
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
139
133