Hapicode

# Nuxt.js の config に i18n 書いたら type エラーで怒られた

GitHub Pages でサイトを公開する際、Nuxt.js と Next.js のどちらを使用するか迷ったため、実際に両方を試してみました。
nuxt.config.ts に i18n の設定を追加すると、型定義に関連するエラーが発生しました。

Object literal may only specify known properties, and 'i18n' does not exist in type 'InputConfig<NuxtConfig, ConfigLayerMeta>

環境

  • "@nuxtjs/i18n": "^9.1.1"
  • "nuxt": "^3.14.1592"

nuxt.config.ts

export default defineNuxtConfig({
  modules: ["@nuxtjs/i18n"],
  i18n: {
    locales: [
      { code: "en", name: "English", file: "en.json" },
      { code: "ja", name: "日本語", file: "ja.json" },
    ],
    defaultLocale: "en",
    lazy: true,
    langDir: "locales/",
    strategy: "prefix", // URLに言語を含める (例: /en, /ja)
  },
  ssr: false,
});

このエラーで Github に issue 出しているユーザーがいるけど、解決しないまま close された

解決しない解決法














 

export default defineNuxtConfig({
  modules: ["@nuxtjs/i18n"],
  i18n: {
    locales: [
      { code: "en", name: "English", file: "en.json" },
      { code: "ja", name: "日本語", file: "ja.json" },
    ],
    defaultLocale: "en",
    lazy: true,
    langDir: "locales/",
    strategy: "prefix", // URLに言語を含める (例: /en, /ja)
  },
  ssr: false,
} as any);

any 型を使ってエラー解消した

TypeScript といえば、やはり React のほうが親和性高いですね。

2024-12-20
  • nuxtjs

関連記事

Nuxtjs 3 に Ant design Vue を使う

Ant-design-vue 4.x使うためのNuxt plugin 設定...

Nuxtjs build WARNING in entrypoint size limit

Nuxtjs build で entrypoint size limit warning エラー発生...

Nuxtjs axios リクエストのヘッダー設定

Nuxtjs axios 通信毎に onRequest に header 設定したい...

Nuxtjs titleTemplate の設定

Nuxtjsのheadにtitleのtemplate使って設定する方法...

Nuxt.js でフロントエンドのカテゴリ選択

バックエンドLaravelとフロントエンドNuxtjsでカテゴリーの一覧表示と選択したら子カテゴリー...

楽天 GOLD に Nuxt で作った HP デプロイ公開した話

楽天GOLDにNuxtjs製HPデプロイ公開!楽天GOLDのFTP操作とNuxtjsで作成したページ...

web 開発でよく使うリダイレクトと nuxtjs redirect

リダイレクトコード、恒久リダイレクト一時的リダイレクトのいろいろをまとめました。...

localStorage is not defined に遭遇した時の対応

nuxtjsのssrモードでlocalStorage is not definedエラーに遭遇！...

nuxtjs の wpa を実装した時のメモ

3分でできるnuxtjs使ってwpa設定 @nuxtjs/wpaモジュール入れて設定追加して画像一枚...

vuejs スクロールでナビバー表示非表示

vuejsで上にスクロールするとナビメニューが表示、下にスクロールすると非表示の切り替えをやってみま...

nuxtjs のページごと head の title description 変更

nuxtjsのhead内titleとdescription動的変更してSEOパワーアップしていこう！...

Nuxtjs に iview 4.0 入れた動かしてみた

日本には普及していない iview がバージョン 4.0 リリースしました。UI フレームワークを ...