Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

react-intl-universal

Package Overview
Dependencies
Maintainers
1
Versions
138
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-intl-universal - npm Package Compare versions

Comparing version 1.0.6 to 1.0.7

2

package.json
{
"name": "react-intl-universal",
"version": "1.0.6",
"version": "1.0.7",
"description": "Internationalize React apps. Not only for React.Component but also for Vanilla JS.",

@@ -5,0 +5,0 @@ "keywords": [

# react-intl-universal
## You May Not Need yahoo/react-intl
## Features
- Can be used not only in React.Component but also in Vanilla JS.
- Simple. Only three main API and one optional helper.
- Display numbers, currency, dates and times for different locales.
- Pluralize labels in strings.
- Support variables in message.
- Support HTML in message.
- Automatically load [Common Locale Data Repository (CLDR)](http://cldr.unicode.org/) locale data on demand. It's used for displaying numbers, currency, dates and times accordingly.
- Support for 150+ languages.
- Runs in the browser and Node.js.
- Message format is strictly implemented by [ICU standards](http://userguide.icu-project.org/formatparse/messages).
For many apps, we don't need the feature provided by [react-intl](https://github.com/yahoo/react-intl) which is able to change locale data dynamically without reloading page. However, if you don't need this feature, just use [react-intl-universal](https://www.npmjs.com/package/react-intl-universal). It can be used not only in React.Component but also in Vanilla JS.
## Live Demo
[React Intl Universal Demo](http://g.alicdn.com/alishu/common/0.0.87/intl-example/index.html)
## Why Another Internationalization Solution for React?

@@ -30,3 +40,3 @@ In case of internationalizing React apps, [react-intl](https://github.com/yahoo/react-intl) is one of most popular package in industry. [react-intl](https://github.com/yahoo/react-intl) decorate your React.Component with wrapped component which is injected internationalized message dynamically so that the locale data is able to be loaded dynamically without reloading page. However, this approach introduces two major issues.

getMyInstance() {
console.log('getMyInstance', this.refs.my);
console.log('getMyInstance', this.refs.my);
}

@@ -45,32 +55,10 @@ }

getMyInstance() {
console.log('getMyInstance', this.refs.my.getWrappedInstance());
console.log('getMyInstance', this.refs.my.getWrappedInstance());
}
}
```
Furthermore, your React.Component's properties is not inherited in subclass since component is injected by [react-intl](https://github.com/yahoo/react-intl).
Furthermore, your React.Component's properties is not inherited in subclass since component is injected by [react-intl](https://github.com/yahoo/react-intl).
That's the reason why we create [react-intl-universal](https://www.npmjs.com/package/react-intl-universal).
## react-intl-universal Features
- Can be used in Vanilla JS, not just in React.Component.
- Display numbers, currency, dates and times for different locales.
- Pluralize labels in strings.
- Support variables in message.
- Support HTML in message.
- Automatically load [Common Locale Data Repository (CLDR)](http://cldr.unicode.org/) locale data on demand. It's used for displaying numbers, currency, dates and times.
- Support for 150+ languages.
- Runs in the browser and Node.js.
- Message format is strictly implemented by [ICU standards](http://userguide.icu-project.org/formatparse/messages).
## Live Demo
[React Intl Universal Demo](http://g.alicdn.com/alishu/common/0.0.87/intl-example/index.html)
## Running Examples Locally
```
git clone git@github.com:alibaba/react-intl-universal.git
cd react-intl-universal/examples
npm install
npm start
```
## Get Started

@@ -91,2 +79,3 @@

// locale data
const locales = {

@@ -229,3 +218,3 @@ "en-US": require('./locales/en-US.js'),

### Helper
`react-intl-universal` provides a utility helping developer determine the user's current locale. As the running examples, when user select a new locale, it redirect user new location like `http://localhost:3000?lang=en-US`. Then, we can use `intl.determineLocale` to get the locale from URL. It can also support determine user's locale via cookie and browser default language. Refer to the APIs section for more detail.
[react-intl-universal](https://www.npmjs.com/package/react-intl-universal) provides a utility helping developer determine the user's current locale. As the running examples, when user select a new locale, it redirect user new location like `http://localhost:3000?lang=en-US`. Then, we can use `intl.determineLocale` to get the locale from URL. It can also support determine user's locale via cookie and browser default language. Refer to the APIs section for more detail.

@@ -270,8 +259,9 @@ ## APIs

## Code Test Coverage Summary
## Running Examples Locally
```
Statements : 84.75% ( 50/59 )
Branches : 81.58% ( 31/38 )
Functions : 90.91% ( 10/11 )
Lines : 84.75% ( 50/59 )
git clone git@github.com:alibaba/react-intl-universal.git
cd react-intl-universal/examples
npm install
npm start
```

@@ -281,3 +271,3 @@

Before using`react-intl-universal`, you need to include scripts below to support IE.
Before using [react-intl-universal](https://www.npmjs.com/package/react-intl-universal), you need to include scripts below to support IE.
```

@@ -292,3 +282,12 @@ <!--[if lt IE 9]>

## Code Test Coverage Summary
```
Statements : 84.75% ( 50/59 )
Branches : 81.58% ( 31/38 )
Functions : 90.91% ( 10/11 )
Lines : 84.75% ( 50/59 )
```
## License
This software is free to use under the BSD license.
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc