fwh1990 / i18n-chain Goto Github PK
View Code? Open in Web Editor NEWHigh performance i18n with typescript that support React, React-Native, Taro and NodeJs
License: MIT License
High performance i18n with typescript that support React, React-Native, Taro and NodeJs
License: MIT License
For @i18n-chain/react
which is designed for React, it would be very useful to be able to have html/React components inside a translation. Currently, text or placeholder can only contain strings. I would like to be able to use html tags (to style some part of the text, or to add a link to some part of the text), or even custom React components.
最近将项目中的 Taro 升级到了 Taro Next,然后编译时 useI18n 报错,发现是 useState 等方法是从 taro 中导出而导致的问题,像这种情况,有办法判断 taro 的版本然后从不同的 package 中导出吗?还是要开个新的分支?
代码片段
const ApplicationNavigations = () => {
const chain = i18n.use();
return (
<SafeAreaView style={styles.container}>
<NavigationContainer theme={defaultTheme} ref={navigationRef}>
<Stack.Navigator
initialRouteName={ROUTES.TABS}
screenOptions={{
cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS,
}}>
<Stack.Screen
name={ROUTES.HISTORY}
component={History}
options={{
title: chain.routes.HISTORY,
}}
/>
</Stack.Navigator>
</NavigationContainer>
</SafeAreaView>
);
};
如果直接导入的话就不会出现上面的错误,但是就无法动态更新了。
"react": "16.13.1",
"react-native": "0.63.4",
"@react-navigation/bottom-tabs": "^5.11.7",
"@react-navigation/material-top-tabs": "^5.3.15",
"@react-navigation/native": "^5.9.2",
"@react-navigation/stack": "^5.14.2",
loader: name => import('./locales/' + name)这行代码报错是为什么?在react-native中使用的
BUNDLE [android, dev] ./index.js ▓▓▓▓▓▓▓▓▓░░░░░░░ 58.1% (828/1086)::ffff:127.0.0.1 - - [10/Nov/2020:05:51:36 +0000] "GET /index.bundle?platform=android&dev=true&minify=false HTTP/1.1" 500 - "-" "okhttp/3.12.1"
error: bundling failed: src/i18n/index.ts: src/i18n/index.ts:Invalid call at line 9: import('./locales/' + name)
微信开发者工具版本:v1.02.2003121
我用v2.0.7的 Taro-cli init 一个新的项目复现了这个问题
可能和 Pull requests #1 的问题一样?我不是很了解。
pages/index/Index.tsx
import Taro, { Component, Config } from "@tarojs/taro";
import { View, Text } from "@tarojs/components";
import { useI18n } from "@i18n-chain/taro";
import "./index.scss";
import i18n from "../../i18n";
const Index = () => {
useI18n(i18n);
console.log(i18n.button.submit)
return <View>before_{i18n.button.submit}_after</View>;
};
export default Index;
i18n/index.ts
import { createI18n } from '@i18n-chain/taro';
import en from './locales/en';
const i18n = createI18n({
defaultLocale: {
key: 'en',
values: en,
},
});
export default i18n;
i18n/locales/index.ts
const en = {
button: {
submit: 'Submit',
cancel: 'Go back',
},
user: {
profile: 'Tom',
},
};
export default en;
export type Locale = typeof en;
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.