Usage with angular and browserify

[kopax]

I am a bit confused,

i18next website tells me do install "i18next-client" instead of "i18next" to use with browserify.

Which version should I use ?

I am interested to use your code, but I can't install it with npm, is there a way to get this work in a later released ?

[bugwelle]

I'm not using browserify. So, why do you want to use it? :) Angular works just fine with ng-i18next (+i18next --> normal version).

Regards, Andre

[jamuhl]

to clearify - when getting i18next from NPM

npm install i18next ---> will install the server component (including express integration) npm install i18next-client ---> will install the client script (CommonJS Version)

[kopax]

Sorry i didn't see your reply before.

I have installed through npm i18next-client and angular.

When I try to install ng-i18next running

npm install i18next/ng-i18next --save-dev

I got the following error

npm ERR! ng-i18next@0.3.5 postinstall: `node ./node_modules/bower/bin/bower inst
all`
npm ERR! Exit status 8
npm ERR!
npm ERR! Failed at the ng-i18next@0.3.5 postinstall script.
npm ERR! This is most likely a problem with the ng-i18next package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node ./node_modules/bower/bin/bower install
npm ERR! You can get their info via:
npm ERR!     npm owner ls ng-i18next
npm ERR! There is likely additional logging output above.
npm ERR! System Windows_NT 6.1.7601
npm ERR! command "D:\\nodejs\\\\node.exe" "D:\\nodejs\\node_modules\\npm\\bin\\n
pm-cli.js" "install" "i18next/ng-i18next" "--save-dev"
npm ERR! cwd E:\014_WORKSPACE\bootstrap
npm ERR! node -v v0.10.32
npm ERR! npm -v 1.4.28
npm ERR! code ELIFECYCLE
npm ERR! not ok code 0

My angular version is 1.2.23 Node version v0.10.32

Why does it need bower ?

Edit: i was able to install it using

npm install git+ssh://git@github.com:i18next/ng-i18next.git#v0.3.4 --save-dev

I have to use the previous documentation, but on load I got this error :

Error: [ng-i18next] Can't find i18next!

I am not using i18next but i18next-client as request on i18next.com, for browserify user.

Any idea for a workaround ? I will also try with i18next instead of i18next-client

[bugwelle]

ng-i18next wasn't written as a node package. It was made for frontend use with i18next.

Could you please explain why you want to use browserify with i18next? :) Why don't you try ng-i18next and i18next without browserify? :)

Please note that I haven't used browserify before.

Regards, Andre

[kopax]

I want to use browserify with i18next because browserify is Imba :+1: and totally pown requireJs (i use both)

I finally was able to solve this using the error message. i18n wasn't available into window.

I was able to solve it like this :

    $ = window.jQuery = window.$ = require('jquery');

var angular = require('angular');
var ngRoute = require('angular-route');

// Translation
window.i18n = require('i18next-client'); // this will make available i18n to ng-i18next
require('ng-i18next');

[jamuhl]

The problem is there is no out of the box way to use the directive with AMD or CommonJS.

[kopax]

I do understand, you should still provide a 'tips' on how to use browserify and your plugin.

Do you guys know what is the correct way to wrap a text with   ??

I have a list that should display

• A test :

I have "A test" in a json translation file

I need to render this html

- A test :

My jade looks like this :

span(ng-i18next="myItem.name")

Should I store in my translation.json the value like this :

" A test :"

Or there is a better way to do it ?

[bugwelle]

:+1:

---

You can use HTML within your strings as shown here: https://github.com/i18next/ng-i18next#html

Try this:

span(ng-i18next="[html]myItem.name")

I hope this helps :)

~Andre

[kopax]

It doesn't look like the correct way, internationalization should only take care of words, not comma semicolon or any spaces.

To illustrate the idea, at this moment, the best available solution would be something like this

span   
span(ng-i18next="myItem.name")
span  :

This will create unnecessary html code, it's not optimized but delegate presentation to the view

[jamuhl]

not sure...whitespaces might be part of internationalization - i think.

eg:

en: bla bla bla? fr: bla bla bla ?

french uses whitespaces in front of punctuation, while english does not.

[kopax]

You must be right, for your example. Take this example :

en 
    "city" (length 4)
    "firstname" (length 9)
fr 
    "ville" (length 5)
    "prénom" (length 6)...

rendering after usage :

"- city :"           (length 8)
"- firstname :" (length 13)
"- ville :" (length 9)
"- prénom :" (length 10)

[jamuhl]

you might use a postprocessor for that: http://i18next.com/pages/doc_features.html#postprocessing

[bugwelle]

It's been almost two months after the last answer to this question, so I'll close this now.

You are free to reopen this issue :)

[ghost]

I see a package.json but this module does not seem to be published via NPM. Wondering if this was a conscious choice.

A bit of context -- I am exploring options with removing bower after reading this article. ng-i18next is the only package in my ~20 depedency bower.json that doesn't seem to have a published NPM package.

Edit: This is now on NPM. I immediately made jamuhl the owner and took myself off of it.

[jamuhl]

@archer96 as i don't maintain this project should i transfer ownership to you?

[bugwelle]

I've now a npmjs account: https://www.npmjs.com/~archer96

@kcaron-cst Well, it was not a conscious choice... I simply never used i18next or ng-i18next with NPM because I always used bower for these packages. I haven't tried browserify, so I can't even say for sure if ng-i18next works with it or with Node.js. I'll reopen this issue until ng-i18next works and is tested with browserify.

@jamuhl :+1:

Regards, Andre

[jamuhl]

@archer96 ownership transfered

[kencaron]

@archer96 sorry for just going ahead and publishing it. Bower has bitten me quite a few times with our continuous integration. It's a lot easier for us to just maintain one package manager and freeze versions. No code changes are needed at all, it is working great so far. Thanks.