VS code - code Snippet

For anyone working on the UI and using VS Code, you can create a user Snippet and keyboard shortcut so that you can easily add the localization code when needed. Add the user Snippet to VS Code by going to File->Preferences->User Snippets and pasting the code below in the javascript.json file.
    "AddLocalizedString": {

        "prefix": "loc",

        "body": [

            "{this.props.translate('${1:stringKey}')}$0"

        ],

        "description": "Add placeholder for localized string. Replace stringKey with localized string key."

    } 

To use your snippet you would type loc to insert this line in your code:    {this.props.translate('stringKey')}  

then replace the stringKey text with the key of the localized string found in the en.js language file. 

For example: 

{this.props.translate('stringKey')} for the string 'Schedule' becomes {this.props.translate('scheduleString')} 

You can also add a keyboard shortcut by going to File->Preferences->Keyboard Shortcuts and then clicking the link at the top to keybindings.json. Add the following to the keybindings.json file: 

  {

    "key": "ctrl+l ctrl+l",

    "command": "editor.action.insertSnippet",

    "when": "editorTextFocus",

    "args": {

      "langId": "javascript",

      "name": "AddLocalizedString"

    }

  } 

When you enter ctrl+l twice, the code for localizing a string will be inserted. You can change the "key" in the shortcut above to whatever combination works for you.

 

posted on 2019-04-13 16:40  cw_volcano  阅读(263)  评论(0编辑  收藏  举报