Closed nicitaacom closed 7 months ago
didn't you read this? https://github.com/i18next/next-i18next/discussions/2223#discussioncomment-7349763
didn't you read this? #2223 (comment)
I read this and I replied to this
As you see I got error
And it error not with my project - I got it after git cline
your example
Also I read this
And see this
Also I see this
And read this
So what do you say about docs for TypeScript user and about testing your own docs how it works? I mean docs requires improvement Library requires fix for this error I send above
You're mixing stuff here.... In your screenshots I see you're following the example for the Next.js App router approach... that's not next-i18next... next-i18next uses the pages approach of Next.js https://stackoverflow.com/questions/76570208/what-is-different-between-app-router-and-pages-router-in-next-js
For next-i18next check this example: https://github.com/i18next/next-i18next/tree/master/examples/simple it is tested on each commit... there are no errors... I just also tried to clone everything on a new machine... and all works as expected... so I assume your local setup has some issues... Just to be sure I uploaded a zip file of the simple example, so you have it also here. simple.zip
An example for the app router approach is here: https://github.com/i18next/next-app-dir-i18next-example-ts
Since this is proofed by a lot of users around the world and it works. I'll close this issue... If you see any other errors that are related to next-i18next please create a minimal reproducible example repository with reproducible steps that illustrates your error. btw: your repository is still mixing stuff, like still using next-intl: https://github.com/nicitaacom/acc2-i18n/blob/development/app/%5Blocale%5D/layout.tsx#L3 and https://github.com/nicitaacom/acc2-i18n/blob/development/app/%5Blocale%5D/page.tsx#L2
this is not next-i18next... and also not plain i18next with app router... but your Next.js approach seems to be the app router approach... but you're still using next-i18next here: https://github.com/nicitaacom/acc2-i18n/blob/development/package.json#L20
So sorry, but please first learn the basics of Next.js (like the differences between pages approach and app approach), then decide which i18n framework you want to rely on... (this repo here is next-i18next (not even i18next core)) and not next-intl... next-intl is here: https://github.com/amannn/next-intl
Why in this case I see error?
I use this guide and do exact same steps as in guide and see
I dan't understand naming of this next-i18next
- if it for pages setup - name it like pages-i18next
or app-i18next
I created this minimal example - https://github.com/nicitaacom/acc2-i18n
In this example I did git clone
as you messaged
Here a TypeScript example: https://github.com/i18next/next-13-app-dir-i18next-example-ts
as I see from naming its for app directory - so why do I get error in this example (I just did git clone)
As I see next steps you give me some guide or steps I need to do to implement internatiolization in my project with next 14 and app router setup I'm preciate your answers If you help me with this step - I will create guide on YouTube (cause I watched some guides and they doesn't work for me) My guide may help other developers with intenatiolization
I try to explain it the last time:
Your example: https://github.com/nicitaacom/acc2-i18n does NOT use i18next or at all... you are using next-intl (i.e. here: https://github.com/nicitaacom/acc2-i18n/blob/development/app/%5Blocale%5D/page.tsx#L2)
I dan't understand naming of this next-i18next - if it for pages setup - name it like pages-i18next or app-i18next
Because next-i18next was created before Next.js introduced app router... so next-i18next is only for the older pages approach.
Here a TypeScript example: https://github.com/i18next/next-13-app-dir-i18next-example-ts
as I see from naming its for app directory - so why do I get error in this example (I just did git clone)
I just tried it myself on 3 different machines, and it works... I don't see any errors.
as I see from naming its for app directory - so why do I get error in this example (I just did git clone)
I just tried it myself on 3 different machines, and it works... I don't see any errors.
I'm expect that I git clone this example and get no errors (I want to implement this example in my project) Here is proof that I got an error
https://github.com/i18next/next-i18next/assets/39565703/d450d743-61e0-4596-9ec2-259fd68cc424
git clone git@github.com:i18next/next-app-dir-i18next-example-ts.git
npm install
tldr;
cd ..
git clone git@github.com:i18next/next-app-dir-i18next-example-ts.git
cd next-app-dir-i18next-example-ts
npm install
└─# cd ..
git clone git@github.com:i18next/next-app-dir-i18next-example-ts.git
cd next-app-dir-i18next-example-ts
npm install
Cloning into 'next-app-dir-i18next-example-ts'...
git@github.com: Permission denied (publickey).
fatal: Could not read from remote repository.
Please make sure you have the correct access rights
and the repository exists.
cd: no such file or directory: next-app-dir-i18next-example-ts
npm ERR! code ENOENT
npm ERR! syscall open
npm ERR! path /home/kali/package.json
npm ERR! errno -2
npm ERR! enoent ENOENT: no such file or directory, open '/home/kali/package.json'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent
npm ERR! A complete log of this run can be found in: /root/.npm/_logs/2024-01-31T07_09_36_136Z-debug-0.log
https://github.com/i18next/next-i18next/assets/39565703/48ccac6c-ee1e-48be-b3b3-19207e893096
I wait that you answer how to fix it
Seems your local git/github setup is broken... => https://stackoverflow.com/questions/12940626/github-error-message-permission-denied-publickey
Try this:
cd ..
git clone https://github.com/i18next/next-app-dir-i18next-example-ts.git
cd next-app-dir-i18next-example-ts
npm install
And if that does also not work... then download this zip file: https://github.com/i18next/next-app-dir-i18next-example-ts/archive/refs/heads/main.zip
unzip it...
I hope this helps...
:)
I'm waiting that you send some instructions I need to do in this case
Or quick video that it work for you and then I do the same (run pnpm build
)
I'll try to explain this the last time.
https://github.com/i18next/next-app-dir-i18next-example-ts and https://github.com/nicitaacom/acc2-i18n are 2 repositories each one with its own package.json and each one being an individual Next.js project. You can't have one inside the other.... So forget about your acc2-i18n folder for a moment... Just open your terminal (not Visual Code) and then do this:
cd ~/Documents/GitHub
git clone https://github.com/i18next/next-app-dir-i18next-example-ts.git
cd next-app-dir-i18next-example-ts
npm install
After that try to compare that project with your acc2-i18n project...
Seems you're lacking the basics of how git and node.js and Next.js works on your file system...
Since it is not my responsibility to teach you these things and I don't have time for it (I have already invested too much time for you), I will not answer you anymore from now on. Good luck.
I will not answer you anymore from now on. Good luck.
Bro its issue in YOUR repository And I did what YOU messaged And its not my problem that after doing what you messaged I have errors
And even after
cd ~/Documents/GitHub
git clone https://github.com/i18next/next-app-dir-i18next-example-ts.git
cd next-app-dir-i18next-example-ts
npm install
I have the same issue because your respositoty is NOT TypeScript version (as you see on screenshot)
I'm waiting update from you up to TypeScript version of https://github.com/i18next/next-app-dir-i18next-example-ts.git
repository
because in name I see ts but in fact its not TypeScript version and if you run pnpm build
it trow error
Please try one last time... I just updated all dependencies to be sure everything is up-to-date:
cd ~/Documents/GitHub
git clone https://github.com/i18next/next-app-dir-i18next-example-ts.git
cd next-app-dir-i18next-example-ts
npm install
If that still shows the errors in your editor, then please run npm run lint
if that works, then your visual code setup might influence it...
If that still shows the errors in your editor, then please run
npm run lint
if that works, then your visual code setup might influence it...
I'm sure that vs code setup don't cause TypeError
Binding element 'lng' implicitly has an 'any' type.ts(7031)
(parameter) lng: any
https://github.com/i18next/next-i18next/assets/39565703/11190491-65b6-4b53-8368-eaedeecea1ad
As you see here you use TypeScript
But in head.tsx
you don't use TypeScript that cause error
I'm waiting update from you for this repository https://github.com/i18next/next-app-dir-i18next-example-ts
that fixes TypeError
I see only typescript...
btw: since TypeScript is a superset of Javascript the code always works... (npm run dev)... Only lint has a problem....
Now npm run lint
work and pnpm build
throw no error
Thank you for fix
Waiting for eslint warning fix
React Hook useEffect has a missing dependency: 'setCookie'. Either include it or remove the dependency array. react-hooks/exhaustive-deps
Also I see this overflow issue
I'm waiting for fix for that as well
it's not an error, but a warning... and it's like that on purpose...
The overflow is just styling with smaller screens
it's not an error, but a warning... and it's like that on purpose... The overflow is just styling with smaller screens
Yes I mean warning
Should be no overflow x Even for small screens should be no overflow x
I created PR - check it whenever you have time https://github.com/i18next/next-app-dir-i18next-example-ts/pull/7
and it's like that on purpose...
In this case I find it better to write comment why its on purpose
You know, this is just an example: https://github.com/i18next/next-app-dir-i18next-example-ts You can do in your code whatever you want...
Mentioned here - https://github.com/i18next/next-i18next/discussions/2223