How can I use this package with Next Js?
sabbirzzaman opened this issue · 2 comments
I'm trying to implement i18n-perser
with Next Js. According to the i18n-perser
documentation, I created a gulpfile.js
on the root directory. I tried probably every possible way to create the to use it with Next Js but it's not working. When I'm using npm run gulp
command it's giving me SyntaxError: Cannot use import statement outside a module
error. I also tried by renaming the gulpfile
to gulpfile.mjs
then it gives me FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory
.
Can you help me with how can I integrate i18n-perser
with my Next Js 13 project? My gulpfile.js
is something like this:
import gulp from 'gulp';
import { gulp as i18nextParser } from 'i18next-parser';
export async function i18next() {
return gulp
.src('./**')
.pipe(
new i18nextParser({
locales: ['en', 'nl'],
output: './i18n/locales/$LOCALE/$NAMESPACE.json',
})
)
.pipe(gulp.dest('./'));
}
For Next Js integration, we can set up the gulpfile.js
file configuration like this:
async function i18next() {
const gulp = (await import("gulp")).default;
const i18nextParser = (await import("i18next-parser")).gulp;
gulp
.src(["./pages/**", "./components/**", "./layouts/**", "./lib/**"])
.pipe(
new i18nextParser({
locales: ["en", "nl"],
output: "./i18n/locales/$LOCALE/$NAMESPACE.json",
})
)
.pipe(gulp.dest("./"));
}
module.exports.i18next = i18next;
@sabbirzzaman
Thanks this works great.
How about watching the changes in keys or values of source languages? Do I need to start a new gulp function or continue to use pipe?