👩💻
NuxtBridge導入してみた③ nuxtをnuxiに変えたら怒られたの巻【後編】
こんにちは。この記事もNuxt使いです。
長編シリーズ化しそうな感じがいたします、NuxtBridgeさんです。
このような流れで戦闘してきています。
今回の問題：yarn devすると見たことないエラーを吐かれる…ERROR Cannot start nuxt: Cannot read properties of undefined (reading 'callHook')→とりあえず先へ進む
こちらの記事とエラーが一緒で、記事さんが「先進め」って言っているので進むことといたしました。
導入手順④ Update nuxt.config
はい、これもガイドどおりにいたします。
nuxt.config.ts
import { defineNuxtConfig } from '@nuxt/bridge'
export default defineNuxtConfig({
// Your existing configuration
})
ガイド通り、追記させて頂きました。
まあ、気にせず、
% yarn dev
Please remove @nuxt/typescript-build from buildModules or set bridge.typescript: false to avoid conflict with bridge.
おおーいエラー！(しかも新しい）
要約すると、
@nuxt/typescript-buildを消すか、bridge.typescript: falseを追加せよ、buildModulesに？
↑こやつは、TypeScript使えるようにするモジュールだと思う。
なんか、NuxtBridgeはもう、TypeScript標準装備してるから、このモジュールはもういらないんだって。
はい、消します。
package.json
- "@nuxt/typescript-build": "^2.1.0"
nuxt.config.ts
buildModules: [
- '@nuxt/typescript-build',
…
],
そして起動。
% yarn dev
起動、した！エミュレータ起動！きた！よっｓｙ…
何も表示がない（なんならdefault.vueのレイアウトのみが鎮座）
コンポーネント一つも拾えていないということですね。
更に言うなら、Firestoreのデータもまったく拾えてない。＝pluginsがなんも動いてない。
orz
はい、まあ、先進めたらよさそうかな。次行きますわ
導入手順⑤ Update tsconfig.json
（むしろこの追記まだなのによく起動したな？）
公式ガイドに言われるがままアプデ。
tsconfig.json
{
+ "extends": "./.nuxt/tsconfig.json",
"compilerOptions": {
...
}
}
追加致した。
でもまだ、エミュレータにはdefaultだけしかでてない…かなりシュールな感じである。
そうこうしてたら、起動しなくなった。
いやそうなのよ、何かに気づかれたのか起動もしなくなったのよ。別になんもしてない気がするけけどなぁ。
なに言ってるかって言うと、
Cannot find module 'XXX/node_modules/globby/ignore.js' imported from XXX/node_modules/globby/index.js
Did you mean to import ignore/index.js?
…ignoreかindex.jsインストールしようとしてる？
してないよ
むしろだれあんた。
今回は以上、次回持ち越し。
本記事のまとめ
問題：yarn devすると怒られる…ERROR Cannot start nuxt: Cannot read properties of undefined (reading 'callHook')
答え：以下の操作をするとエラーが別のに変わる…Cannot find module 'XXX/node_modules/globby/ignore.js' imported from XXX/node_modules/globby/index.js
nuxt.config.ts
import { defineNuxtConfig } from '@nuxt/bridge'
export default defineNuxtConfig({
// Your existing configuration
})
して
package.json
- "@nuxt/typescript-build": "^2.1.0"
nuxt.config.ts
buildModules: [
- '@nuxt/typescript-build',
…
],
して
tsconfig.json
{
+ "extends": "./.nuxt/tsconfig.json",
"compilerOptions": {
...
}
}
した。
いやー、次回へ続く…
Discussion