cibernox / svelte-intl-precompile

I18n library for Svelte.js that analyzes your keys at build time for max performance and minimal footprint
https://svelte-intl-precompile.com
ISC License
274 stars 13 forks source link

Few errors #14

Closed Ebeldev closed 3 years ago

Ebeldev commented 3 years ago

I have followed the steps on the instruction how to set up but I do get a few errors.

  1. In the hooks.js file in your example, the variable acceptedLocale is never exported. It seems to me that's a typo mistake. Is that right?
  2. I have my locales folder in src. What changes shoud I make in the svelte.config in order to work ?
  3. in the _layout.svelte, if we are doing ssr, should we put the code in the context="module" script tag ? If so, Eslint tell us that I can use a $session inside a script context="module"
  4. And finally, I did change the location of my locales and restarted the server but nothing works. I still get errors when I try to output the translation. 'The message ... was not found in ""'.

So for me it doesn't work in sveltekit so far.

Thank you for your help.

ydoc118 commented 3 years ago

I too am getting the same warnings when start my server The message "text" was not found in "", "en"., but my application loads with all of my messages correctly.

@Ebeldev I think in the hooks it is a typo, just rename the return to { acceptedLocale }

cibernox commented 3 years ago

It is a typo indeed. Fixing it.

cibernox commented 3 years ago

Fixed. Thanks for reporting it.

cibernox commented 3 years ago

I missed the other points.

  1. You should put precompileIntl('src/locales') in you svelte.config.js file. The argument passed in is the path to the folder containing the locales.
  2. The fact that you are doing SSR shouldn't make you use a context="module". I might be missing why you think that.
  3. I believe this error is because the misconfiguration in point 2.
Ebeldev commented 3 years ago

@cibernox Thank you for your response.

I did adjust the svelte.config.js,

`import preprocess from 'svelte-preprocess'; import precompileIntl from "svelte-intl-precompile/sveltekit-plugin.js"; import typescript from '@rollup/plugin-typescript';

const production = !process.env.ROLLUP_WATCH /* @type {import('@sveltejs/kit').Config} / const config = { // Consult https://github.com/sveltejs/svelte-preprocess // for more information about preprocessors preprocess: preprocess({

}),

kit: {
    // hydrate the <div id="svelte"> element in src/app.html
    target: '#svelte',
    vite: {
        plugins: [
            precompileIntl('src/locales'), // if your translations are defined in /locales/[lang].js,
            typescript({
            sourceMap: !production,
            inlineSources: !production
            })
        ]
    }
}

};

export default config;`

But after restarting the server, I still get the The message 'name of my variable' was not found in''.

Hooks.js export function getSession(request) { let acceptedLocale = request.headers["accept-language"].split(',')[0]; return { acceptedLocale }; }

_layout.svelte `

`

index.svelte `

{$t('general.site_name')}

Visit kit.svelte.dev to read the documentation

{$t('test')}

`

fr.js export default { "general": { "site_name": "Le blog d'Etienne" }, "home": { "title": "Page d'accueil" }, "test": "Je sais pas ", }

Ebeldev commented 3 years ago

My mistake. I was using _layout.svelte and not __layout.svelte.

Double underline that was my mistake.

cibernox commented 2 years ago

Glad you figured it out 😃