Angular CLI 11 で ng new してみた

こんにちは！kossyです！

さて、今回はAngular11が最近リリースされたとのことで、
早速ng newコマンドを試して、何が変わったのか検証してみたいと思います。

環境
node 12.13.1
npm 6.14.8
Angular 11.0.1

コマンド実行！

$ ng new sample

? Do you want to enforce stricter type checking and stricter bundle budgets in the workspace?
  This setting helps improve maintainability and catch bugs ahead of time.
  For more information, see https://angular.io/strict

https://angular.io/strict アクセスしたら https://angular.io/guide/strict-mode にリダイレクトした、、、

上記ドキュメントにも書いてあるとおり、Strict Modeを有効化するための設定ですね。

? Would you like to add Angular routing?

これは前のバージョンからある設問ですね。
ルーティング機能が必要なのであればyを押してenterしましょう

? Which stylesheet format would you like to use? (Use arrow keys)
❯ CSS
  SCSS   [ https://sass-lang.com/documentation/syntax#scss                ]
  Sass   [ https://sass-lang.com/documentation/syntax#the-indented-syntax ]
  Less   [ http://lesscss.org                                             ]
  Stylus [ https://stylus-lang.com                                        ]

CSSの言語はどれにします？っていう設問ですね。
これも前のバージョンからありました。

うーん変わったのは一番最初の設問だけかな？

tsconfig.jsonの違い

1番目の設問で、strictモードにしなかった時としたときの差分をみてみました。

true

/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true,
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "module": "es2020",
    "lib": [
      "es2018",
      "dom"
    ]
  },
  "angularCompilerOptions": {
    "strictInjectionParameters": true,
    "strictInputAccessModifiers": true,
    "strictTemplates": true
  }
}

false

/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "module": "es2020",
    "lib": [
      "es2018",
      "dom"
    ]
  }
}

ここではtsconfig.jsonの詳しい設定には触れませんが、
no...の部分と、AngularCompilerOptionが差分になっていますね。
この部分については別記事で触れたいと思います。

Readmeも比較してみた

これはあんまりかわったところはなさそう

勉強になりました。