環境構築でVue CLIによって作られたファイルを見ていく（設定系）
自分が見返すようなので結構適当です。（特に最後のほう）
やりたいことリスト

あんまりコーディングとは関係なさそうな子たち

関係ないわけじゃないけど、普段から触るわけじゃないファイル
知識程度には知っておきたいので軽くまとめる

README

まあ、まずはREADMEから読む。
現場とかなら、命名規則とかが書いてあるのかしら

それぞれのコマンドについて書いてあるだけだった
次！

.browserrslistrc

なにこれ？
対象のブラウザを決めておいて、書いたコードがその対象のブラウザでも、ちゃんと動作するかを確認するときにつかうっぽい
package.jsonに書くこともあるとか

 公式のマニュアルとかを見ると現状は、
・シェア率が1%より大きい
・ブラウザのバージョンが、最新かその一つ前
・24か月以内に公式のサポートや更新がないものを除く
・ie11(InternetExplorer)を除く
らしい

今は気にしなくていいかな
参考になったサイト

.editorconfig

エディタが異なってもインデントとか、タブとかを合わせてくれるらしい（公式）
そんなものがあったのか、、、！！
大学１年の時に、友人とWebサイト作っていた時に、AtomとVScodeとでインデントがぐっちゃぐちゃになって、泣きながら整理したトラウマが、、、（あの頃知っていれば、、、）

VScodeはプラグインを入れる必要があるらしい

ほかのエディターでもプラグインが必要なものが結構あるみたい（共同開発するなら、必要なプラグインを一括で入れてくれるやつ導入したいね）

現状は
・.js, .jsx, .ts, .tsx, .vue これらの拡張子のファイルが対象
・インデントのスタイルは、ソフトタブ（半角スペース）
・インデントのサイズは2（半角スペース2つ）
・行末の空白を削除する
・最終行に空行を入れる

気になるところがあれば追加・編集していきたいですね（参考）

.eslintrc.js

ESLintってよく聞く気がする（ルール決めのやつだと思ってる）
どうやらJavaScriptのための政敵検証ツールらしい
バグ見つけたり、スタイル統一してくれたり

プラグインを入れるとリアルタイムで反映してくれるとか

root:true
一番上にある.eslintrcファイルだよ。
これがないと、上に.eslintrcファイルがないか検索しに行くらしい
env
どの環境で使うのかみたいな感じらしい
windows関数とかはブラウザ上なら使えるけど、コード上では定義されてないから、ESLintに怒られるので、それを防ぐみたいな（参考）
Node: true
今回はNode.js上で動かすぜってしている
extends
あらかじめ用意されている設定を読み込む（プラグインとか）
ルールが多すぎて一から設定するのは大変だから、ここでまとめて追加するらしい
vue/vue3-essential
eslintのvue用のプラグインに書かれてるやつ
eslint:recommended
eslintが推奨しているルールたち（参考）
（allのほうがいい説もあるらしい）
@vue/eslint-config-typescript
Vue-TypeScript用のやつ（参考）
rules
個別で設定するルール
vue/multi-word-component-names
コンポーネントの名前は、複数の単語を使おうねっていうルール
なんか邪魔らしいからoffにしてるっぽい

.gitignore

git add の対象外になるファイルを指定するやつ

packege.json

Node.jsにおいてインストールするパッケージが記述されたファイル
コマンド一つで、環境に必要なパッケージを全部インストールしてくれるやつ
下記のどっちかで実行できる（ほかにもあるけど）

npm install
yarn

書き方は調べたほうが早そう（参考）

tsconfig.json

TypeScriptのコンパイルの設定ファイル
Node.jsはTypeScriptをサポートしているわけじゃないので必要とのこと
どのバージョンのJS向けに出力するかとかの設定をするらしい

esnextが何回か出てきたので気になって調べたら、、、

JavaScript 言語は変化し続けており JavaScript コードを書く場合に使用される構文も固定されておらず、時間と共に変化します。Ecma International は JavaScript 言語仕様を制定する組織で、仕様は ECMAScript と呼ばれます。新しい JavaScript 仕様は毎年発行され、2015年に発行された 6番目の版は ES6 と参照されます。このドキュメントではより適切に最新の仕様を ESNext と参照します。

とのこと（参考）

tsconfig.node.json

よくわからんかった
Node上で動かす時のtsconfigみたいな解釈

vite.config.json

Viteの設定ファイル
そもそもViteってなんぞや

細かく見ていく

plugins

拡張するためのプラグインを追加する
Vueのプラグイン
 Vutifyのプラグイン
中身までは理解しきれなかった、、、

define

ビルド時にアプリコード内から参照可能なグローバル定数を生成できる。

resolve

インポートの時のファイル名を省略できるようになったりするらしい（参考）

alias

../../views/Home.vue とかを @/views/Home.vue って書けるように設定されている

extensions

拡張子を省略できるっぽい
.vueを省略するのはあまりお勧めされてないっぽいので消しておく

確かに今の職場でも、.vueは書いてたイメージ

sever

全然調べてないけど、localhostのポートの設定とかできそう
3000から8080に変えてみてます

yarn.lock

package.jsonに書かれているライブラリ等の正確なバージョンを記録しているもの
こちらがとても参考になりそう

npm installしたときは、package-lock.jsonになるっぽい（こっちは見たことある）

node_module

nodeの何か
一回消して入れなおす、みたいなことしたことある気がする（何の意味があるかは忘れた）

publick

アイコン画像が入ってた

おわり

座学疲れた、、、
最後らへんめっちゃ適当になってしまった、、、

適時必要な時に思い出して、いじっていきたいなとは思っています。
次はsrcを見ていく！！！