search

GrapesJS / grapesjs

Free and Open source Web Builder Framework. Next generation tool for building templates without coding
https://grapesjs.com
BSD 3-Clause "New" or "Revised" License
22.36k stars 4.05k forks source link

[QUESTION] Can't use i18n #2718

Closed Lerdouille closed 4 years ago

Lerdouille commented 4 years ago

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 :

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

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 :)

pouyamiralayi commented 4 years ago

@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 commented 4 years ago

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 commented 4 years ago

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_frWEBPACK_IMPORTED_MODULE_0 = webpack_require(/! ./locale/fr / "./src/i18n/locale/fr.js");

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