更新負荷低減のために未使用ライブラリを整理する #5237

ghost · 2020-08-09T14:03:57Z

改善詳細 / Details of Improvement

更新負荷低減のためにpackage.jsonにある未使用ライブラリが何かを整理します
Renovate（依存ライブラリ更新）の運用方法を考える(Renovate（依存ライブラリ更新）の運用方法を考える #5142)からライブラリ整理関連トピックの分岐です
(分岐するのはよろしくないとのご意見があればはこのIssueはクローズ致します)

スクリーンショット / Screenshot

package.jsonの変更履歴(参考)

期待する見せ方・挙動 / Expected behavior

更新負荷低減のために未使用ライブラリの削除と関連修正を行うことが考えられます

動作環境・ブラウザ / Environment

本番環境/開発環境

The text was updated successfully, but these errors were encountered:

ghost · 2020-08-09T14:05:13Z

削除候補
- dependencies
  - @types/d3
経緯
- マップ関連のコンテンツ用に追加
- 既に以下のコンテンツは削除済
  - 新宿区/千代田区エリアの来訪者推移（参考値）
  - 新宿駅/東京駅周辺の人口推移（参考値）
ライブラリ削除に伴う関連修正
- ui-test/ogp_screenshot.pyの以下も削除可能と考えられます
```
       if ('heatmap' in path):
            time.sleep(20)
```
- その他の関連データファイルについては(古いファイルのクリーンアップ #5092)にて削除することも考えられます

ghost · 2020-08-09T14:06:44Z

削除候補
- devDependencies
  - rimraf
経緯
- hardsource用に追加
- yarn devでの開発やNetlifyのビルド時にhardsource に関するエラーが発生するため無効化

ライブラリ削除に伴う関連修正

nuxt.config.tsの以下も削除可能と考えられます

    // https://ja.nuxtjs.org/api/configuration-build/#hardsource
    // hardSource: process.env.NODE_ENV === 'development'

package.jsonの以下も削除可能と考えられます

    "clean-hardsource": "rimraf ./node_modules/.cache/hard-source"

ghost · 2020-08-09T14:38:56Z

削除候補
- devDependencies
  - nodemon

経緯

create-nuxt-appで追加
ほぼ直後にpackage.jsonのdevを以下から変更してnodemonを使わなくなりました
```
    "dev": "cross-env NODE_ENV=development nodemon server/index.js --watch server"
```

現在のpackage.jsonのdevは以下のようになっています

    "dev": "cross-env NODE_ENV=development GENERATE_ENV=development nuxt-ts",
    "dev-no-axe": "cross-env NODE_ENV=dev-no-axe GENERATE_ENV=development nuxt-ts",

ライブラリ削除に伴う関連修正
- 無いと考えられます

ghost · 2020-08-09T15:08:35Z

削除候補
- dependencies
  - express
経緯
- create-nuxt-appで追加
- yarn.lockでwebpack-bundle-analyzerのdependenciesにexpressがあります
- 東京都コロナ対策サイトのソースコードからはexpressを直接利用していないと考えられます
- yarn remove express && yarn devを実行してWebブラウザで確認しても正常に動作しているように見えます
ライブラリ削除に伴う関連修正
- 無いと考えられます

ghost · 2020-08-09T16:14:33Z

削除候補
- devDependencies
  - babel-jest
  - jest
  - vue-jest
経緯
- create-nuxt-appで追加
- その後package.jsonのtestを以下から変更してjestを使わなくなりました(echoするのみで返るように変更)
```
    "test": "jest"
```
- 現在はyarn testを実行すると以下のようになります
```
tokyo-citizen@macos covid19 % yarn run test
yarn run v1.22.4
$ echo 'skip tests (there is no test)'
skip tests (there is no test)
✨  Done in 0.06s.
```
- 東京都コロナ対策サイトのソースコードからはjestを直接利用していないと考えられます
- yarn remove babel-jest jest vue-jest && yarn devを実行しても正常に動作しているように見えます
- 今後jestでテストの自動化を行わないのであればという条件付きで削除可能と考えられます

ライブラリ削除に伴う関連修正

以下のファイルも不要になると考えられます

jest.config.js (jestの設定ファイル)
.babelrc (create-nuxt-appで自動作成後に微修正はあれど以下のようにtestのエントリしか存在しません) (本当に不要？)

{
  "env": {
    "test": {
      "presets": [
        [
          "@babel/preset-env",
          {
            "useBuiltIns": "usage",
            "corejs": 3,
          },
        ],
      ]
    },
  },
}

必要に応じてworkflowでyarn run testを実行している部分(echoして返るので放置する考え方もあります)

tokyo-citizen@macos covid19 % grep -R "yarn run test" .github
.github/workflows/staging.yml:      - run: yarn run test
.github/workflows/deploy.yml:      - run: yarn run test
.github/workflows/screenshot.yml:      - run: yarn run test
.github/workflows/ogp_builder.yml:      - run: yarn run test
.github/workflows/build.yml:      - run: yarn run test

mcdmaster · 2020-08-09T21:52:34Z

@tokyo-citizen まとめありがとうございます。
.babelrc ファイルは、 #5061 で私が変更を掛けたものなので、コメントさせてください。
結論から言えば、こんごは「不要」というご理解でオーケーです。（という、私の考え方です）

出典はこちらです。

feat(webpack): auto detect core-js version

#5061 の修正の目的は、core-js のバージョン番号の 3 への固定化でした。
現状、nuxt >= 2.14.0 が core-js バージョンを自動検出してくれるということであれば、以下が期待できます。

.babelrc をはじめとする、コードの削減
core-js バージョン依存のリスクを nuxt に移転する

ですので、我々としては .babelrc の呪縛から逃れる（？）ために、削除をするのがいいと思います

kaizumaki · 2020-08-10T01:23:13Z

まとめありがとうございます！助かります 🙏

今後 jest でテストの自動化を行わないのであればという条件付きで削除可能と考えられます

jestでやるかどうかは別として、自動テストは導入したいのですよね...
ただこちら #5142 (comment) でもコメントしたとおり、自動テストがどういうものになるのか、私がわかっておらず。
どなたか別途ご提案いただけると、たいへんうれしいです 🙇‍♀️

ghost · 2020-08-10T04:34:33Z

jestの要否に関連するネタという理屈でここに付けます。

@kaizumaki
モダンなWebアプリケーションのテストは私もよくわからないので、まずはGoogle検索大明神に少しだけ
お伺いを立ててみたところ、程良いところで以下を見つけました。
(単体テストや結合テストはなかなか手を出しにくいと思いますのでやるとしてもUIテストあたりがターゲットかなと...)

ざっと読みながら、なんか似たネタのOpen Issueを垣間見たぞと思い出したので以下も参考として。

JestのSnapshot Testingを導入したい (JestのSnapshot Testingを導入したい #3122)
storybookの導入 (storybookの導入 #756)

kaizumaki · 2020-08-10T07:10:40Z

@tokyo-citizen リファレンスありがとうございます。
なるほど、UIテストをターゲットにするのはよさそうですね。別途issueを立ててもらえると助かります 🙏

本題の「jestが必要かどうか」ですが、「必要そうだけどもテスト導入時に周辺ライブラリも含めて改めて検討」でよいような気がします。
なので、このissueを進めるにあたっては「削除」でいいんじゃないですかね。

ghost · 2020-08-10T08:06:13Z

@kaizumaki
このIssueの方向性について大体まとまったと思いますので、とりあえずテスト方法の検討についてIssueを立てました！
(更新負荷低減のためにリグレッションテスト方法を検討する #5246)

ghost · 2020-08-11T00:31:09Z

@goki90210 さんが挙げていたdependenciesとdevDependenciesのカテゴリ整理が残っていました。
(そもそも論の他にRenovateでdependenciesとdevDependenciesのルールを変えるという応用も考えられます)

カテゴリ整理について情報お持ちしております！

ghost · 2020-08-11T00:39:29Z

さらに @shgtkshruch さんが挙げていた直接依存していないライブラリもpackage.jsonに追加されているというのも残っていました。
(RenovateからのPRについての対応対象を減らすという観点でこれも大事です)

こちらについても情報お待ちしております！

shgtkshruch · 2020-08-11T21:46:47Z

公式ドキュメントにもあるとおり、Vue と Vue Meta は Nuxt.js に含まれています。

Nuxt.js はリッチなウェブアプリケーションを構築するために下記のものを含んでいます

• Vue 2
• Vue Router
• Vuex（ストアオプションを利用している場合に限る）
• Vue Server Renderer（mode: 'spa' を利用している場合を除く）
• Vue Meta
ref: https://ja.nuxtjs.org/guide

また TypeScript と ts-loader は @nuxt/typescript-build に含まれています。
こちらもドキュメントにありますが、Nuxt.js の TypeScript 対応で必須のライブラリは @nuxt/typescript-build と @nuxt/types です。
（package.json から TypeScript と ts-loader を削除しても、yarn generate:deploy などのコマンドは通ります）

Nuxt.js などのフレームワークを採用することのメリットの 1つは、ライブラリの管理や汎用的な処理を任せることで、プロジェクト固有の部分にリソースを割けることだと思います。

フレームワークに任せるよりも自分たちで管理したほうが保守性が上がる場合や新機能を使う場合は良いと思いますが、特別な理由がない限りフレームワークとプロジェクトで同じライブラリを二重管理するのはおすすめしません。

こちらにも書きましたがリソースやポリシーによるので、管理したい方がいらっしゃる場合はおまかせします 🙏

kaizumaki · 2020-08-12T01:40:10Z

@shgtkshruch

特別な理由がない限りフレームワークとプロジェクトで同じライブラリを二重管理するのはおすすめしません。

この点、私も同意です。それがエコシステムのいいところではないかと思っています。

そしてなにより保守の労力が軽減される方向に持っていきたいです。現在の体制（みなさんがご協力いただいている）がいつまでも続くとは限らないと思っているので...。

ghost · 2020-08-16T17:43:36Z

以下については、ドキュメントで明示的に指定されているのでdependenciesからdevDependenciesに
移動で良いと思います。

@nuxtjs/dotenv
- https://github.com/nuxt-community/dotenv-module/blob/master/README.md
axe-core
- https://axe.vue-a11y.com/guide/
cross-env
- https://github.com/kentcdodds/cross-env/blob/master/README.md

ghost · 2020-08-16T17:51:25Z

ここまでをまとめると以下のようになります。
このIssueのコメントに出ていていない@vue/test-utilsを削除対象にしたのは、テスト方針が
定まるまではjestを一旦削除するとなったので、使いどころがないと考えたためです。

削除
@types/d3
@vue/test-utils
babel-jest
express
jest
nodemon
rimraf
ts-loader
typescript
vue
vue-jest
vue-meta
devDependenciesに移動
@nuxtjs/dotenv
axe-core
cross-env

以下のように削除と移動を行った後でbuildやgenerateを行ってWebブラウザ(Safari)で
確認しましたが問題ないようです。
(移動するときにバージョン指定しているのはRenovateの導入時にpin留めしたためです)

tokyo-citizen@macos covid19 % node --version
v12.18.3
tokyo-citizen@macos covid19 % yarn --version
1.22.4
tokyo-citizen@macos covid19 % yarn remove @types/d3
tokyo-citizen@macos covid19 % yarn remove express
tokyo-citizen@macos covid19 % yarn remove vue
tokyo-citizen@macos covid19 % yarn remove vue-meta
tokyo-citizen@macos covid19 % yarn remove @vue/test-utils
tokyo-citizen@macos covid19 % yarn remove babel-jest
tokyo-citizen@macos covid19 % yarn remove jest
tokyo-citizen@macos covid19 % yarn remove nodemon
tokyo-citizen@macos covid19 % yarn remove rimraf
tokyo-citizen@macos covid19 % yarn remove ts-loader
tokyo-citizen@macos covid19 % yarn remove typescript
tokyo-citizen@macos covid19 % yarn remove vue-jest
tokyo-citizen@macos covid19 % grep \"@nuxtjs/dotenv\": package.json
    "@nuxtjs/dotenv": "1.4.1",
tokyo-citizen@macos covid19 % yarn remove @nuxtjs/dotenv
tokyo-citizen@macos covid19 % yarn add -D @nuxtjs/[email protected]
tokyo-citizen@macos covid19 % grep \"axe-core\": package.json
    "axe-core": "4.0.1",
tokyo-citizen@macos covid19 % yarn remove axe-core
tokyo-citizen@macos covid19 % yarn add -D [email protected]
tokyo-citizen@macos covid19 % grep \"cross-env\": package.json
    "cross-env": "7.0.2",
tokyo-citizen@macos covid19 % yarn remove cross-env
tokyo-citizen@macos covid19 % yarn add -D [email protected]

ghost · 2020-08-16T17:54:35Z

横道にそれますが、generateするときに、いつの日からか以下のエラーが出ているようです。
(NetlifyのDeploy関連ログにも似たようなエラーが出ています)

 ERROR  window is not defined                                         00:37:38

  at a.setWidths (pages/index.js:23841:7)
  at un.run (node_modules/vue/dist/vue.runtime.common.prod.js:6:27543)
  at sn (node_modules/vue/dist/vue.runtime.common.prod.js:6:25554)
  at Array.<anonymous> (node_modules/vue/dist/vue.runtime.common.prod.js:6:12260)
  at Wt (node_modules/vue/dist/vue.runtime.common.prod.js:6:11661)
  at runNextTicks (internal/process/task_queues.js:62:5)
  at listOnTimeout (internal/timers.js:518:9)
  at processTimers (internal/timers.js:492:7)

どうもyarn.lockが腐っているようで、以下のようにして再生成したら解決したようです。
(勘違いだったらすいません)

tokyo-citizen@macos covid19 % mv yarn.lock yarn.lock.bak
tokyo-citizen@macos covid19 % yarn install
tokyo-citizen@macos covid19 % diff -q yarn.lock.bak yarn.lock
Files yarn.lock.bak and yarn.lock differ
tokyo-citizen@macos covid19 % rm yarn.lock.bak
tokyo-citizen@macos covid19 % yarn build
tokyo-citizen@macos covid19 % yarn generate

ghost · 2020-08-16T19:15:37Z

ライブラリ整理に伴う関連修正についてもまとめます。

@types/d3関連

ui-test/ogp_screenshot.pyから以下のコードを削除

       if ('heatmap' in path):
            time.sleep(20)

rimraf関連

nuxt.config.tsから以下のコードを削除

    // https://ja.nuxtjs.org/api/configuration-build/#hardsource
    // hardSource: process.env.NODE_ENV === 'development'

package.jsonから以下のコードを削除

    "clean-hardsource": "rimraf ./node_modules/.cache/hard-source"

jest関連
- jest.config.jsをファイル削除
- .babelrcをファイル削除
- GitHub Actionsの設定ファイルにあるyarn run testの部分は削除しない
  (package.jsonにtestが残してあり、echoして返るだけで現状でも実害はなく、
  GitHub Actionsの設定ファイルから削除すると後から戻すのも厄介と考えられるため)

mcdmaster · 2020-08-17T00:18:37Z

こちら、実は本家 Vuetify に PR を上げたりしています。
私も同じエラーに遭遇したため、そもそも Vue 内で DOM オブジェクトの window を頭に見るとか、ポリシに一貫性を欠くよね？と思ったのがキッカケです

横道にそれますが、generateするときに、いつの日からか以下のエラーが出ているようです。
(NetlifyのDeploy関連ログにも似たようなエラーが出ています)

 ERROR  window is not defined                                         00:37:38

  at a.setWidths (pages/index.js:23841:7)
  at un.run (node_modules/vue/dist/vue.runtime.common.prod.js:6:27543)
  at sn (node_modules/vue/dist/vue.runtime.common.prod.js:6:25554)
  at Array.<anonymous> (node_modules/vue/dist/vue.runtime.common.prod.js:6:12260)
  at Wt (node_modules/vue/dist/vue.runtime.common.prod.js:6:11661)
  at runNextTicks (internal/process/task_queues.js:62:5)
  at listOnTimeout (internal/timers.js:518:9)
  at processTimers (internal/timers.js:492:7)

どうもyarn.lockが腐っているようで、以下のようにして再生成したら解決したようです。
(勘違いだったらすいません)

tokyo-citizen@macos covid19 % mv yarn.lock yarn.lock.bak
tokyo-citizen@macos covid19 % yarn install
tokyo-citizen@macos covid19 % diff -q yarn.lock.bak yarn.lock
Files yarn.lock.bak and yarn.lock differ
tokyo-citizen@macos covid19 % rm yarn.lock.bak
tokyo-citizen@macos covid19 % yarn build
tokyo-citizen@macos covid19 % yarn generate

kaizumaki · 2020-08-17T01:23:48Z

@tokyo-citizen まとめありがとうございます！

ここまでをまとめると以下のようになります。
このIssueのコメントに出ていていない@vue/test-utilsを削除対象にしたのは、テスト方針が
定まるまではjestを一旦削除するとなったので、使いどころがないと考えたためです。

削除
@types/d3
@vue/test-utils
babel-jest
express
jest
nodemon
rimraf
ts-loader
typescript
vue
vue-jest
vue-meta

devDependenciesに移動
@nuxtjs/dotenv
axe-core
cross-env

ご提案の通りでいいのではないかと思いますが、みなさんいかがでしょう？

goki90210 · 2020-08-17T14:28:58Z

私は、
#5142 (comment)
で述べた点が守られていればpackage.jsonから削除してもいいです。

再掲します。

ソースから直接使用しているものはpackage.jsonから削除してはいけません。
ただし、依存関係を正しく理解することがどこかで担保されている場合はこの限りではありません。
（yarn.lockを見ろはナシです。）

理由はたとえフレームワーク側で依存しているからと言っても、
そのフレームワークが依存をやめれば使えなくなるおそれがあります。
（ビルドで失敗するからそれでいいのではという意見もあるかと思いますが）

ghost · 2020-08-17T15:26:47Z

@goki90210
コメントありがとうございます。
長いのとコマンドがちょっとダサいのは大変申し訳ないですが、私の整理した内容について、
末尾につける内容からどのように扱えば良いか教えていただけないでしょうか？
(vue-metaは#5237 (comment)にて「Vue Meta は Nuxt.js に含まれています」と
コメントありましたが)

バレていると思いますが、私はJS/TSは全くもってド素人ですので、頓珍漢なことを言って
いたらすいません。

tokyo-citizen@macos covid19 % egrep '(require\(|import.*from)' ./**/*.{js,ts,vue} | cut -d\' -f2 | sort -r | uniq
~/utils/monitoringStatusValueFormatters
~/components/ConfirmedCasesByMunicipalitiesTable.vue
vue/types/options
vue-spinner/src/ScaleLoader.vue
vue-scrollto
vue-meta
vue-i18n
vue-chartjs
vue-axe
vue
nuxt-i18n/types/nuxt-i18n
nuxt-i18n
dayjs/plugin/duration
dayjs/plugin/customParseFormat
dayjs
chart.js
axe-core/locales/ja.json
autoprefixer
@nuxt/types/app
@nuxt/types
@fullhuman/postcss-purgecss
@/utils/tab-event-bus.ts
@/utils/monitoringStatusValueFormatters
@/utils/i18nUtils
@/utils/formatTable
@/utils/formatMonitoringItems
@/utils/formatGraph
@/utils/formatDayBeforeRatio
@/utils/formatDate.ts
@/utils/formatDate
@/utils/formatConfirmedCases
@/utils/colors
@/utils/card-event-bus
@/static/selectmenu.svg
@/static/printer.svg
@/static/printer-white.svg
@/static/parent.svg
@/static/masktrash.svg
@/static/flow/phone.svg
@/static/flow/cond_sydr.svg
@/static/flow/cond_sy.svg
@/static/flow/cond_anx.svg
@/static/flow/bed.svg
@/static/earth.svg
@/static/covid.svg
@/static/antenna.svg
@/plugins/vue-chart
@/pages/flow.vue
@/data/tokyo_rule.json
@/data/tokyo_alert.json
@/data/positive_status.json
@/data/positive_rate.json
@/data/positive_by_diagnosed.json
@/data/positive_by_developed.json
@/data/patient.json
@/data/news.json
@/data/monitoring_items.json
@/data/metro.json
@/data/data.json
@/data/daily_positive_detail.json
@/data/consultation_about_fever.json
@/data/agency.json
@/components/cards/UntrackedRateCard.vue
@/components/cards/TokyoRulesApplicationNumberCard.vue
@/components/cards/TestedNumberCard.vue
@/components/cards/TelephoneAdvisoryReportsNumberCard.vue
@/components/cards/SevereCaseCard.vue
@/components/cards/PositiveRateCard.vue
@/components/cards/PositiveNumberByDiagnosedDateCard.vue
@/components/cards/PositiveNumberByDevelopedDateCard.vue
@/components/cards/MonitoringItemsOverviewCard.vue
@/components/cards/MonitoringConsultationDeskReportsNumberCard.vue
@/components/cards/MonitoringConfirmedCasesNumberCard.vue
@/components/cards/MetroCard.vue
@/components/cards/HospitalizedNumberCard.vue
@/components/cards/ConsultationAboutFeverNumberCard.vue
@/components/cards/ConfirmedCasesNumberCard.vue
@/components/cards/ConfirmedCasesDetailsCard.vue
@/components/cards/ConfirmedCasesByMunicipalitiesCard.vue
@/components/cards/ConfirmedCasesAttributesCard.vue
@/components/cards/CardRow.vue
@/components/cards/AgencyCard.vue
@/components/WhatsNew.vue
@/components/UntrackedRateMixedChart
@/components/TokyoAlertCard.vue
@/components/TimeStackedBarChart.vue
@/components/TimeBarChart.vue
@/components/StaticInfo.vue
@/components/StaticCard.vue
@/components/SiteTopUpper.vue
@/components/SideNavigation.vue
@/components/SevereCaseBarChart.vue
@/components/ScrollableChart.vue
@/components/PrinterButton.vue
@/components/PositiveRateMixedChart
@/components/PageHeader.vue
@/components/OpenDataLink.vue
@/components/NoScript.vue
@/components/MonitoringItemsOverviewTableValueWithTranslatableUnit.vue
@/components/MonitoringItemsOverviewTableMedicalSystem.vue
@/components/MonitoringItemsOverviewTableInfectionStatus.vue
@/components/MonitoringConsultationDeskReportChart.vue
@/components/MonitoringConfirmedCasesChart.vue
@/components/MonitoringCommentFrame.vue
@/components/MonitoringCommentCard.vue
@/components/MixedBarAndLineChart.vue
@/components/MetroBarChart.vue
@/components/MenuList.vue
@/components/LinkToInformationAboutEmergencyMeasure.vue
@/components/LanguageSelector.vue
@/components/ExternalLink.vue
@/components/DevelopmentModeMark.vue
@/components/DataViewShare.vue
@/components/DataViewExpantionPanel.vue
@/components/DataViewDataSetPanel.vue
@/components/DataViewCustomInfoPanel.vue
@/components/DataViewBasicInfoPanel.vue
@/components/DataView.vue
@/components/DataTable.vue
@/components/DataSelector.vue
@/components/DashedRectangleTimeBarChart.vue
@/components/ConfirmedCasesDetailsTable.vue
@/components/CardsReference.vue
@/components/CardsMonitoring.vue
@/components/AgencyBarChart.vue
@/components/ActiveTokyoAlert.vue
./nuxt-i18n.config
./chartjs-adapter-dayjs

mcdmaster · 2020-08-20T01:24:00Z

ここまでの検討で、dependencies にまだある（はずの）モジュールの中でも、devDependencies に下ろせるものがないかどうか少し調べてみました。
@nuxt/types (参考) がいけそうです。ぜひ、ご検討をば。

ちなみに、他の dependencies アイテムも個別に調べ済みです。
yarn add -D オプションを明示したものは、@nuuxt/types 以外にはありませんでした。以上、ご参考になりましたら

ghost · 2020-08-22T04:23:29Z

@goki90210 さんにコメント頂いた require/import されているライブラリの packege.jsonへの
記載について、私の調べ方が足りず繰り返しご指摘いただくことになり申し訳ないです。

過去の経緯を調べてみると、以下の趣旨で PR #4871 にて丁寧にご説明いただいたものでした。

packege.json に記載がない require/import がある
package.json に記載がないため SonarQube (Sonar way recommendedを適用)で指摘されている
(PR packege.jsonに記載がないrequire/importがある。 #4871 にて話題の一つにしている webpack については、その後に PR ConfigurationをNuxtConfigに変更する #4924 で関連対処とともに削除 )

ghost · 2020-08-22T04:23:47Z

@kaizumaki さん
飛び道具のようになりますが、ご相談です。
更新負荷低減を目的とする未使用ライブラリ整理について、最後の一歩のところまできた気がします。
@shgtkshruch さんのコメント(フレームワークに任せる範囲)と@goki90210 さんのコメント(require/import
との関係)を踏まえて、なるべく合意が形成されたまとめにした方がいいと思っているのですが、進め方について
お知恵拝借できないでしょうか。package.jsonについては過去に何度か千本ノック状態になっているようで
センシティブかと思いますので。

kaizumaki · 2020-08-22T06:12:35Z

@tokyo-citizen まとめありがとうございます！助かります。
まずは @shgtkshruch さんのコメント(フレームワークに任せる範囲)のとおりにpackage.jsonを構成し、それを元にSonarQubeにかけるといいのではと思います。その結果によってpackage.jsonにaddする、と。ここまで１つのPRでできるでしょうか。
なるべく手作業を減らす方向でいきたいです。

ghost · 2020-08-23T04:06:31Z

@kaizumaki さん
おっしゃるような進め方が straight forwardかつ手堅い進め方ですね！
非常にタイミングが悪く、着手すると以下のようにビルドエラーが発生するので、待ちになりました。😭
参考: vuejs/vue#11605

  Error:
  
  Vue packages version mismatch:
  
  - [email protected] (node_modules/vue/dist/vue.runtime.common.js)
  - [email protected] (node_modules/vue-template-compiler/package.json)
  
  This may cause things to work incorrectly. Make sure to use the same version for both.
  If you are using vue-loader@>=10.0, simply update vue-template-compiler.
  If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

kaizumaki · 2020-08-23T04:31:09Z

@tokyo-citizen おっと、そのビルドエラーはRenovateのPR #5313 をマージすると解決しますか？

ghost · 2020-08-23T05:21:26Z

@kaizumaki
直接的な回答になっていないですが、逃げようと vue を消さずに pin 留めのまま居残りさせて、
yarn.lock を hard refresh すると、これまたタイミングが悪く、次は vuex がないと怒られる
という新ネタが出てきます。

ちょっと前までは発生しなかったので、vue 関連の upstream での最近のアップデートが
アレかもしれないと思い始めています...

kaizumaki · 2020-08-23T05:44:30Z

@tokyo-citizen nuxtが依存しているvueのバージョンがまずいのでしょうか...？ #5283 のマージあたりがあやしいですかね？

ghost · 2020-08-23T06:28:40Z

@kaizumaki
大変心苦しいのですが、ビルドエラーがなんでかを追い詰めていくのは、お力になれそうにないです...

今のところ yarn.lock を hard refresh (一回消して再生成)しない限り、ビルドエラーは発現しない
と思います。

GitHub Actions をみると、本番 deploy 等では yarn に --frozen-lockfile オプションを
つけていますし、特に直近の定期リリースに向けては、直ちに問題になるものではないと思います。
(直ちにビルドエラーになるのであれば、ここ数日の PR の自動チェックが全部コケているはずです)

kaizumaki · 2020-08-23T07:00:40Z

@tokyo-citizen おお、情報ありがとうございます！しばらく様子をみますね。vueまわりのアップデートは注視しておきますね。

kaizumaki · 2020-08-30T07:19:33Z

@tokyo-citizen Renovate関連でいろいろあった結果、 #5350 でyarn.lockをリフレッシュするに至りました。こちらのissueが進められるかなと思うのですが、どうですかね？

kaizumaki · 2020-09-29T04:30:24Z

こちらのissueを段階的に進めようと思います。私のほうでも依存ライブラリのひとつひとつを調べていたところでした。
すでにみなさんが検討・検証していただいていたので助かりました。
まずは第一弾として明らかにどこからも参照されていないライブラリ＋test関連から削除したいと思います。

削除予定

@types/d3
@vue/test-utils
babel-jest
express
jest
nodemon
vue-jest

（#5432 についてはすでに #5443 で進めてもらってOKです）

kaizumaki · 2022-01-08T14:26:48Z

こちらのissueは一旦クローズとします。

ghost added the improvement 改善や新機能の要望 label Aug 9, 2020

kaizumaki added the help-wanted 特に助けを必要としているもの label Aug 10, 2020

mcdmaster mentioned this issue Aug 22, 2020

Update vue monorepo to v2.6.12 #5313

Closed

1 task

mcdmaster mentioned this issue Sep 15, 2020

[Suggestion] Autoprefixer@10 への対応方針 #5432

Closed

kaizumaki mentioned this issue Oct 6, 2020

未使用ライブラリをremove #5506

Merged

Foo-x mentioned this issue Jun 23, 2021

Jestの設定ファイルをTS化 #6460

Closed

kaizumaki closed this as completed Jan 8, 2022

更新負荷低減のために未使用ライブラリを整理する #5237

更新負荷低減のために未使用ライブラリを整理する #5237

Comments

ghost commented Aug 9, 2020 • edited by ghost Loading

改善詳細 / Details of Improvement

スクリーンショット / Screenshot

期待する見せ方・挙動 / Expected behavior

動作環境・ブラウザ / Environment

ghost commented Aug 9, 2020 • edited by ghost Loading

ghost commented Aug 9, 2020 • edited by ghost Loading

ghost commented Aug 9, 2020 • edited by ghost Loading

ghost commented Aug 9, 2020

ghost commented Aug 9, 2020 • edited by ghost Loading

mcdmaster commented Aug 9, 2020

kaizumaki commented Aug 10, 2020

ghost commented Aug 10, 2020

kaizumaki commented Aug 10, 2020

ghost commented Aug 10, 2020

ghost commented Aug 11, 2020

ghost commented Aug 11, 2020

shgtkshruch commented Aug 11, 2020

kaizumaki commented Aug 12, 2020

ghost commented Aug 16, 2020

ghost commented Aug 16, 2020 • edited by ghost Loading

ghost commented Aug 16, 2020 • edited by ghost Loading

ghost commented Aug 16, 2020

mcdmaster commented Aug 17, 2020

kaizumaki commented Aug 17, 2020

goki90210 commented Aug 17, 2020

ghost commented Aug 17, 2020 • edited by ghost Loading

mcdmaster commented Aug 20, 2020 • edited Loading

ghost commented Aug 22, 2020

ghost commented Aug 22, 2020

kaizumaki commented Aug 22, 2020

ghost commented Aug 23, 2020 • edited by ghost Loading

kaizumaki commented Aug 23, 2020

ghost commented Aug 23, 2020

kaizumaki commented Aug 23, 2020

ghost commented Aug 23, 2020 • edited by ghost Loading

kaizumaki commented Aug 23, 2020

kaizumaki commented Aug 30, 2020

kaizumaki commented Sep 29, 2020

削除予定

kaizumaki commented Jan 8, 2022

ghost commented Aug 9, 2020 •

edited by ghost

Loading

ghost commented Aug 9, 2020 •

edited by ghost

Loading

ghost commented Aug 9, 2020 •

edited by ghost

Loading

ghost commented Aug 9, 2020 •

edited by ghost

Loading

ghost commented Aug 9, 2020 •

edited by ghost

Loading

ghost commented Aug 16, 2020 •

edited by ghost

Loading

ghost commented Aug 16, 2020 •

edited by ghost

Loading

ghost commented Aug 17, 2020 •

edited by ghost

Loading

mcdmaster commented Aug 20, 2020 •

edited

Loading

ghost commented Aug 23, 2020 •

edited by ghost

Loading

ghost commented Aug 23, 2020 •

edited by ghost

Loading