Next.js next-i18next不支持assetPrefix url?
我正在尝试在服务器端和客户端实现多语言。一切都是工作我只有在客户端更改生产上的语言时遇到问题(在本地主机上它可以工作,因为它没有前缀路径) 本地主机上的url为 产品上的url是 问题当我单击“更改语言”按钮时,url指向错误的位置,我不知道为什么i18n会路由到此。。正确的答案是 这是我在生产中使用的下一个.config.jsNext.js next-i18next不支持assetPrefix url?,next.js,i18next,Next.js,I18next,我正在尝试在服务器端和客户端实现多语言。一切都是工作我只有在客户端更改生产上的语言时遇到问题(在本地主机上它可以工作,因为它没有前缀路径) 本地主机上的url为 产品上的url是 问题当我单击“更改语言”按钮时,url指向错误的位置,我不知道为什么i18n会路由到此。。正确的答案是 这是我在生产中使用的下一个.config.js const { parsed: localEnv } = require('dotenv').config({ path: __dirname + `/.env.$
const { parsed: localEnv } = require('dotenv').config({
path: __dirname + `/.env.${process.env.NODE_ENV}`
});
const webpack = require('webpack');
const withImages = require('next-images');
const production = process.env.NODE_ENV === 'production';
const prefix = 'http://example.com/someprefix';
module.exports = withImages({
assetPrefix: production ? prefix : '',
plugins: [new webpack.EnvironmentPlugin(localEnv)],
webpack: (config, { isServer }) => {
// Fixes npm packages that depend on `fs` module
if (!isServer) {
config.node = {
fs: 'empty',
net: 'empty',
tls: 'empty'
};
}
return config;
}
});
我有更改我使用的语言(客户端)的按钮。更改语言
...
<button type="button" onClick={() => i18n.changeLanguage('en')}>
change lang client side EN
</button>
<button type="button" onClick={() => i18n.changeLanguage('th')}>
change lang client side TH
</button>
...
MyPage.getInitialProps = async props => {
const { isServer } = props.ctx;
if (isServer) {
// called on server
} else {
// called on client
}
return { isServer, namespacesRequired: ['common', 'footer'] };
};
export default withTranslation('common')(MyPage);
这是server.js
const express=require('express');
const next=需要(“next”);
const bodyParser=require('body-parser');
const routeApi=require('./路由器/索引');
const nextI18NextMiddleware=require('next-i18next/middleware')。默认值
const nextI18next=require('../i18n')
const dev=process.env.NODE_env!='生产",;
const app=next({dev});
const handle=app.getRequestHandler(app);
const PORT=process.env.PORT | 3000;
应用程序
.准备
.然后(()=>{
const server=express();
use(bodyParser.json());
use(bodyParser.urlencoded({extended:true}));
使用('/api',routeApi);
使用(nextI18NextMiddleware(nextI18next))
server.get('*',(req,res)=>{
返回句柄(req、res);
});
侦听(端口,错误=>{
如果(错误)抛出错误;
console.info(`>它与next
无关,而是与next-i18next
相关
从它的源代码来看,这个库提供的是一个“修复”URL的库
所以,您可以看到,lngPathCorrector
不支持在某些路径下为下一个应用程序提供服务
欢迎您对此进行PR。仅修复库中的url?您是否有使此项目成功运行的建议?是的,库不支持我只是在您建议它工作时添加更多代码csr:edit file\node\u modules\next-i18next\dist\commonjs\utils\lng-path-corrector.js SSR:edit file\node\u modules\next-i18next\dist\commonjs\mi数据包
const NextI18Next = require("next-i18next").default;
const production = process.env.NODE_ENV === 'production';
module.exports = new NextI18Next({
defaultLanguage: "th",
otherLanguages: ["en"],
defaultNS: ["common"],
//SSR
//myapp.com ---> Homepage in defaultLanguage
//myapp.com/en ---> Homepage in English
localeSubpaths: {
th: production ? 'th': 'th',
en: production ? 'en': 'en'
},
// workaround until next-i18next support public path
// https://github.com/isaachinman/next-i18next/issues/523
localePath: typeof window === "undefined" ? "public/locales" : "someprefix/locales"
});