反応アプリをil8nが実装された単一のスパに変換した後、translation.jsonにアクセスできないためラベルを取得できないという問題に直面しています。
正しくするために webpack.config.js の何かを変更する必要がありますか
import i18n from "i18next";
import { initReactI18next } from "react-i18next";
import i18nextHttpBackend from "i18next-http-backend";
import Cookies from "js-cookie";
import LanguageDetector from "i18next-browser-languagedetector";
i18n
.use(i18nextHttpBackend)
.use(initReactI18next)
.use(LanguageDetector)
.init({
lng: Cookies.get("locale") || "es",
fallbackLng: "en",
debug: false,
supportedLngs: ["en", "es"],
interpolation: {
escapeValue: false,
},
});
export default i18n;
il8n は App.js import "./i18n"; にインポートされます。
シングル スパに変換する前は、アプリは正常に動作し、http://localhost:3000/locales/en/translation.json への呼び出しを行っていましたが、アプリをシングル スパに変換した後、get 要求は失敗します。 http://single-spa-playground.org/locales/en/translation.json
このチュートリアルhttps://www.youtube.com/watch?v=W8oaySHuj3Y&list=PLLUD8RtHvsAOhtHnyGx57EYXoaNsxGrTU&index=13に従って、反応アプリを単一のスパに変換しました。
WebPack 構成
const { merge } = require("webpack-merge");
const singleSpaDefaults = require("webpack-config-single-spa-react");
const Dotenv = require("dotenv-webpack");
module.exports = (webpackConfigEnv, argv) => {
console.log(webpackConfigEnv);
const defaultConfig = singleSpaDefaults({
orgName: "WHATEVR",
projectName: "WHATEVER",
webpackConfigEnv,
argv,
});
return merge(defaultConfig, {
// modify the webpack config however you'd like to by adding to this object
plugins: [new Dotenv()],
devServer: {
headers: {
"Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Methods":
"GET, POST, PUT, DELETE, PATCH, OPTIONS",
"Access-Control-Allow-Headers":
"X-Requested-With, content-type, Authorization",
},
},
});
};
解決策を試しましたが、まだ解決されていない Reactjs - 翻訳ファイルの読み込みエラー