https://github.com/mrblueblue/jsx-gettext-extract-loader
extracts strings from jsx to be translated by gettext
https://github.com/mrblueblue/jsx-gettext-extract-loader
Last synced: 2 months ago
JSON representation
extracts strings from jsx to be translated by gettext
- Host: GitHub
- URL: https://github.com/mrblueblue/jsx-gettext-extract-loader
- Owner: mrblueblue
- License: mit
- Created: 2015-09-30T19:35:27.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2015-09-30T23:39:40.000Z (over 9 years ago)
- Last Synced: 2025-03-07T22:47:12.615Z (3 months ago)
- Language: JavaScript
- Size: 141 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
#jsx-gettext-extract-loader
Your code in JSX looks like this:
```html
```
But it gets mangled by Webpack:
```javascript
_react2['default'].createElement(
'div',
null,
_react2['default'].createElement(
'a',
{ onClick: _this.handleLearnMoreClick,
href: 'http://www.dailymotion.com/repost',
style: { textDecoration: 'none' }
},
(0, _i18n.__)('Learn more')
)
)
```
Problem: gettext does not know what needs to be translated. It is look for `__('learn more')` and cannot read `(0, _i18n.__)('Learn more')`
Solution: extract out gettext translations to another file for gettext!
```javascript
modules: {
...
loaders: [
...
{
test: /\.jsx$/,
loaders: ['react-hot', 'babel', 'jsx-gettext-extract-loader?output=.tmp']
}
...
]
...
}
```
This creates a gettext readable file with all the gettext translations:
```javascript
// .tmp/jsx-translations.js
__('learn more')
__('a new way to share')
```
To be used in conjunction with something like [`grunt-xgettext`](https://github.com/arendjr/grunt-xgettext)