Handsontable 한글 패치 방법 (vue js)

Handsontable 한글 패치 방법 

handontable 을 사용하다 보면 

영문으로 나오는 부분이 있습니다. 

그래서 한국어를 직접 작성하여 패치 하고자 하여 

handontable 의 문서중 

https://docs.handsontable.com/i18n/missing-language-code

의 예제를 보고 

github 에서  handontable 을 소스 를 받아서  

npm install 을 하고 

메뉴얼 있는데로 

...................

등의 작업을 하고  

npm install build:language 로 컴파일 까지 완료 하였고 

메뉴얼에 있는데로 

import Handsontable from 'handsontable'; import 'handsontable/languages/ko-KR';

을 했지만  

계속 하여  

Language with code "ko-KR" was not found. You should register particular language before using it. Read more about this issue at: https://docs.handsontable.com/i18n/missing-language-code.

해당 메세지가 뜹니다. 

결국 안되서 

컴파일 되어 나온 코드중 일부를 프로젝트 안에서 사용 하기로 했습니다. 

처음에는 물론 

import Handsontable from 'handsontable';

을 추가해 줍니다. 

그리고 mounted 부분에 

mounted(){

var C = Handsontable.languages.dictionaryKeys;

var _dictionary;

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key,

{ value: value, enumerable: true, configurable: true, writable: true }); }

else { obj[key] = value; } return obj; }

var dictionary = (_dictionary = {

languageCode: 'ko-KR'

}, _defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_ROW_ABOVE, 'Insert row above'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_ROW_BELOW, 'Insert row below'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_INSERT_LEFT, 'Insert column left'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_INSERT_RIGHT, 'Insert column right'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_REMOVE_ROW, ['Remove row', 'Remove rows']),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_REMOVE_COLUMN, ['Remove column', 'Remove columns']),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_UNDO, 'Undo'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_REDO, 'Redo'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_READ_ONLY, 'Read only'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_CLEAR_COLUMN, 'Clear column'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_ALIGNMENT, 'Alignment'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_ALIGNMENT_LEFT, 'Left'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_ALIGNMENT_CENTER, 'Center'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_ALIGNMENT_RIGHT, 'Right'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_ALIGNMENT_JUSTIFY, 'Justify'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_ALIGNMENT_TOP, 'Top'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_ALIGNMENT_MIDDLE, 'Middle'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_ALIGNMENT_BOTTOM, 'Bottom'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_FREEZE_COLUMN, 'Freeze column'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_UNFREEZE_COLUMN, 'Unfreeze column'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_BORDERS, 'Borders'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_BORDERS_TOP, 'Top'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_BORDERS_RIGHT, 'Right'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_BORDERS_BOTTOM, 'Bottom'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_BORDERS_LEFT, 'Left'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_REMOVE_BORDERS, 'Remove border(s)'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_ADD_COMMENT, 'Add comment'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_EDIT_COMMENT, 'Edit comment'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_REMOVE_COMMENT, 'Delete comment'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_READ_ONLY_COMMENT, 'Read-only comment'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_MERGE_CELLS, '셀 병합'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_UNMERGE_CELLS, '셀 분리'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_COPY, '복사'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_CUT, '잘라내기'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_NESTED_ROWS_INSERT_CHILD, 'Insert child row'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_NESTED_ROWS_DETACH_CHILD, 'Detach from parent'),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_HIDE_COLUMN, ['Hide column', 'Hide columns']),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_SHOW_COLUMN, ['Show column', 'Show columns']),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_HIDE_ROW, ['Hide row', 'Hide rows']),

_defineProperty(_dictionary, C.CONTEXTMENU_ITEMS_SHOW_ROW, ['Show row', 'Show rows']),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_NONE, 'None'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_EMPTY, 'Is empty'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_NOT_EMPTY, 'Is not empty'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_EQUAL, 'Is equal to'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_NOT_EQUAL, 'Is not equal to'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_BEGINS_WITH, 'Begins with'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_ENDS_WITH, 'Ends with'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_CONTAINS, 'Contains'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_NOT_CONTAIN, 'Does not contain'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_GREATER_THAN, 'Greater than'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_GREATER_THAN_OR_EQUAL, 'Greater than or equal to'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_LESS_THAN, 'Less than'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_LESS_THAN_OR_EQUAL, 'Less than or equal to'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_BETWEEN, 'Is between'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_NOT_BETWEEN, 'Is not between'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_AFTER, 'After'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_BEFORE, 'Before'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_TODAY, 'Today'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_TOMORROW, 'Tomorrow'),

_defineProperty(_dictionary, C.FILTERS_CONDITIONS_YESTERDAY, 'Yesterday'),

_defineProperty(_dictionary, C.FILTERS_VALUES_BLANK_CELLS, 'Blank cells'),

_defineProperty(_dictionary, C.FILTERS_DIVS_FILTER_BY_CONDITION, 'Filter by condition'),

_defineProperty(_dictionary, C.FILTERS_DIVS_FILTER_BY_VALUE, 'Filter by value'),

_defineProperty(_dictionary, C.FILTERS_LABELS_CONJUNCTION, 'And'),

_defineProperty(_dictionary, C.FILTERS_LABELS_DISJUNCTION, 'Or'),

_defineProperty(_dictionary, C.FILTERS_BUTTONS_SELECT_ALL, '전체 선택'),

_defineProperty(_dictionary, C.FILTERS_BUTTONS_CLEAR, 'Clear'),

_defineProperty(_dictionary, C.FILTERS_BUTTONS_OK, 'OK'),

_defineProperty(_dictionary, C.FILTERS_BUTTONS_CANCEL, 'Cancel'),

_defineProperty(_dictionary, C.FILTERS_BUTTONS_PLACEHOLDER_SEARCH, '검색'),

_defineProperty(_dictionary, C.FILTERS_BUTTONS_PLACEHOLDER_VALUE, 'Value'),

_defineProperty(_dictionary, C.FILTERS_BUTTONS_PLACEHOLDER_SECOND_VALUE, 'Second value'),

_dictionary);

Handsontable.languages.registerLanguageDictionary(dictionary);

}

위와 같은 코드로 적용 하여 

셋팅에서 

language : 'ko-KR',

을  하고 나니  적용이 되었습니다. 

메뉴얼을 잘못 이해 할수 있을수 있지만  직접 위와 같이 적용 하였습니다.