bukinoshita / detect-browser-language

Detect browser language

detect-browser-language

Detect browser language

Install

$ yarn add detect-browser-language

Browser support

• Chrome
• Firefox
• IE
• Edge
• Opera
• Safari

Usage

// without SSR (server-side rendering) — React example
import React from 'react'
import detectBrowserLanguage from 'detect-browser-language'

export default () =>
  <h1>{detectBrowserLanguage()}</h1>

// with SSR (server-side rendering) — React example
import React, { Component } from 'react'

export default class Page Component {
  componentDidMount() {
    const detectBrowserLanguage = require('detect-browser-language')
    this.setState({ userLanguage: detectBrowserLanguage() })
  }

  render() {
    const { userLanguage } = this.state

    return <h1>{userLanguage}</h1>
  }
}

PS: Works with other libraries as well.

Why

If you have a website that has intl implemented use this library to get user preferred language instead trying to guess the language based on their geolocation. I might be in France but that does't mean I speak/read french.

License

MIT © Bu Kinoshita

detect-browser-language's Issues

Code won't minify on build

The code will not minify successfully upon running npm run build. The following error is thrown:

Creating an optimized production build...
Failed to compile.

Failed to minify the code from this file: 

 	./node_modules/detect-browser-language/index.js:3 

Read more here: http://bit.ly/2tRViJ9

This is due to ES6 function definition being used in index.js. Substituting with ES5 syntax makes the minification and build pass. I'll shortly create a pull request with working code.

Does not work in Safari

It detects English though in my Mac OS I have Hungarian language set. Laguage is not set per browser in Mac Safari. Maybe this is the reason of the bug.

SEO Friendly?

I installed that dependency and when I search the page in Google, the page description appears in English when the page is in Spanish and the geolocation is in a Hispanic-speaking country. If the user does not have the browser set to Spanish, the page appears in English, which is fine. But it's not okay for Google bots. Any solutions?

Doesn't work on IE 11

Breaks down on module export with Syntax error

module.exports = () =>
  (navigator.languages && navigator.languages[0]) ||
  navigator.language ||
  navigator.userLanguage

I know it is trendy to just ditch everything that is older than 3 months, but unfortunately a lot of users are still on windows 7 using IE 11.

React Dependencies

I don't understand why a language detection library has dependencies like
react-popup-betatable-testlist-tablereact-table-list-beta..
I would rather call it react browser language detection or remove the optional dependencies.