<p class="codepen" data-height="331" data-theme-id="dark" data-default-tab="css,result" data-user="junkisai" data-slug-hash="rNMEzGv" style="height: 331px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;" data-pen-title="基本左詰めなんだけど領域はみ出るときは左からはみ出すやーつ">
  <span>See the Pen <a href="https://codepen.io/junkisai/pen/rNMEzGv">
  基本左詰めなんだけど領域はみ出るときは左からはみ出すやーつ</a> by Junki Saito (<a href="https://codepen.io/junkisai">@junkisai</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://cpwebassets.codepen.io/assets/embed/ei.js"></script>

IMG 5404

基本左詰めだが、領域はみ出るときは折り返さず左からはみ出させる

```
{
  "compilerOptions": {
    "target": "es5", /* どの動作環境向けにトランスパイルするかを指定 */
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true, /* JavaScriptファイルをコンパイル可能に */
    "skipLibCheck": true, /* 型定義ファイル（*.d.ts）の型チェックをスキップ */
    "strict": true, /* すべての厳密な型チェックオプションを有効化 */
    "forceConsistentCasingInFileNames": true, /* ファイルの大文字小文字の違いをエラー報告 */
    "noEmit": true, /* コンパイル結果を出力しない */
    "esModuleInterop": true, /* CommonJSモジュールとESモジュール間の相互運用性を,すべてのインポート用に名前空間オブジェクトを作成することで可能 */
    "module": "esnext", /* どのモジュールパターンで出力するかを指定 */
    "moduleResolution": "node", /* モジュール解決戦略を指定 */
    "resolveJsonModule": true, /* jsonファイルから型解決した状態で値を取得可能に */
    "isolatedModules": true, /* 各ファイルを個別のモジュールとしてトランスポート */
    "jsx": "preserve" /* tsx拡張子におけるjsxサポートを指定 */
  },
  "exclude": [
    "node_modules"
  ],
  "include": [
    "next-env.d.ts",
    "**/*.ts",
    "**/*.tsx"
  ]
}
```

Code

基本左詰めだが、領域はみ出るときは折り返さず左からはみ出させる

Next.jsで自動生成されるtsconfig.jsonの中身を調べたメモ