[QUESTION] Can't use i18n

Question

Code SnippetTEXT

Hi again @artf ,
you close my previous ticket but i don't succeed to reopen it

i saw the documentation and the part reguarding i18n but i didn't succed to use it.
In your documentation, you use some import function, basically my code is pretty simpler and without import, like this :

&lt;html&gt;
&lt;body&gt;
&lt;link rel=&quot;stylesheet&quot; href=&quot;grapesjs/css/grapes.min.css&quot;&gt;
&lt;script src=&quot;grapesjs/grapes.js&quot;&gt;&lt;/script&gt;
&lt;div id=&quot;gjs&quot;&gt;
&lt;h1&gt;Hello World Component!&lt;/h1&gt;
&lt;/div&gt;
&lt;script type=&quot;text/javascript&quot;&gt;
var editor = grapesjs.init({
showOffsets: 1,
noticeOnUnload: 0,
container: '#gjs',
height: '100%',
width: 'auto',
fromElement: true,
showDevices: 0,
storageManager: { autoload: 0 },
});
&lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;

I managed too implement some plugins and configure the design of the editor, but i'm stucked with this i18n issue...

Could you please tell me what i'm doing wrong ? for the record i'm not in a Node environnement

I precise that i apparently my project is for now composed with only 3 files, the grapesjs.js, grapes.css and my HTML file. When i download your project on github, there are a few folders (and specially on named /src where i can find the locales files), but the plugin does not need them to work, is it normal ?

Regards and thank you again for the support :)

Answers (3)

pouyamiralayi• April 18, 20200 reactions

@Lerdouille your issue is not related to grapesjs, you have to reference your locale objects somehow which i suggest using global variables for them, and to import them, is basically a matter of including their related scripts inside your html. Cheers!

artf• April 20, 20200 reactions

Current code of locale files are optimized only for importing them via import, if you want to improve that PR are welcome

you close my previous ticket but i don't succeed to reopen it

There is no need to keep questions open if there is a need to reply I'll do it, so please, next time avoid opening other duplicates

Lerdouille• April 20, 20200 reactions

Thank you for your answers. I do succeed to display the good translation by tweaking the grapes.js.

To do that, i had to copy/paste the part

**/ "./src/i18n/locale/en.js": /!!
! ./src/i18n/locale/en.js ! */ /*! exports provided: default */

and replace all translation by another langage.

Then, i had to declare the variables in the part : "./src/i18n/config.js" with this (for French translation in my code) : /* harmony import / var locale_fr__WEBPACK_IMPORTED_MODULE_0_ = webpack_require(/! ./locale/fr */ "./src/i18n/locale/fr.js");

and update the "message" variable below by : messages: { en: locale_en__WEBPACK_IMPORTED_MODULE_0_["default"], fr: locale_fr__WEBPACK_IMPORTED_MODULE_0_["default"] }

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.

Presets Plugins Components Blocks Assets Commands I18n Layers Styles Storages RTE Newsletters Web pages Site builders

Question

Answers (3)

Related Questions and Answers

[Question/Bug] grapesjs throws a DOMException if you import HTML contents with invalid (numbered) attributes

[Question] How do I set <body> attributes

[BUG] Text components don't behave correctly after creating custom components

[Question] Exclude html elements from model

Paid Plugins That Match This Issue

Browse Plugin Categories