기록

0. 환경 - ubuntu 16.04 - nuxt 2.10 - node.js 4.6 -> 8.16.2 - npm 3.5 -> 6.4 - nginx 1.10 1. fibers 패키지 설치 오류   nuxt의 dependency인 fibers가 설치가 안돼서 nuxt도 설치되지 않는 문제가 발생했다. fibers 설치 시 node 명령어를 찾아오지 못하는 문제였다. 아래 명령어로 강제로 링크시키면 된다. ln -s /usr/bin/nodejs /usr/bin/node 오류 메시지에 ubuntu 사용자면 apt-get install g++ build-essential 를 실행하라는 메시지가 나오는데 이미 설치되어 있는 것 같다. 2. nuxt를 실행시킬 수 없는 오류   오류 메시지로 node.js를 최신 버전으로 업그레이드하라는 말이 나와서 업그레이드. https://github.com/nodesource/distributions/blob/master/README.md  이 페이지를 참조해서 8.6.12 버전으로 업그레이드했다. 참고로 "curl -sL https://deb.nodesource.com/setup_버전.x | sudo -E bash -" 로 바꾸면 다른 버전도 설치할 수 있다. nvm을 사용해도 되지만 사용자가 여럿일 경우 설치를 진행한 사용자가 아닌 사용자가 nodejs를 사용할 수 없어서 nvm 삭제 후 다시 설치했다. 어떻게(?) 하면 되는 것 같지만 저 위의 방법이 더 편하다. 3. fibers 문제 다시 발생  devDependencies에 있던 fibers를 지우니까 된다... node_modules/를 지우고 전체 패키지를 재설치했다 (sudo npm install) . 4. nginx 설정   사이트 주소로 들어오면 3000포트로 연결하도록 설정하면 된다. nginx경로/sites-enabled/default(파일 이름 변경 가능)에 아래 내용을 추

0. 환경 - Vue 2.6 - Nuxt 2 - handsontable 7.1 - @handonsable/vue 4.1 1. 설치 1) 패키지 설치    https://handsontable.com/docs/7.1.1/frameworks-wrapper-for-vue-installation.html  일단 이 페이지 안내대로 설치한다. 2) nuxt에 적용   보통 외부 패키지를 사용하려면  https://ko.nuxtjs.org/guide/plugins/#vue-%ED%94%8C%EB%9F%AC%EA%B7%B8%EC%9D%B8  이렇게 하는데 플러그인을 만드는 방법이 좀 다르다. https://github.com/handsontable/vue-handsontable-official/issues/70  이 페이지를 참조해서 아래와 같이 작성했다. import Vue from 'vue' import { HotTable } from '@handsontable/vue' export default () => {   if (process.client) {     Vue.component('hot-table', HotTable)   } } nuxt.config.js에는 아래 코드를 추가. ... css: [   'CSS파일경로/handsontable.full.css' ], plugins: [   ...   {src: '~/plugins/플러그인이름.js', ssr: false} ], 클라이언트에서만 적용되는 라이브러리라 그런 것 같다. 2. startRows/startCols와 data property   startRows/startCols보다는 data property가 우선된다. 예를 들어 startRows=10 startCols=10 data=[[null, null, null, null, null], [null, null, n

0. 환경 - CKEditor4 : 아마 standard package를 다운받아서 사용 - SVG-edit( https://github.com/SVG-Edit/svgedit ) editor 부분만 사용 - CKEditor에 SVG-edit을 붙인건 내가 한게 아니라 잘 모르겠음. 1. 문제 - SVG-edit에서 객체를 만들고 id를 바꾸고 저장하고 나갔다가 다시 불러오면 자동 생성된 id(svg_XX)로 바뀌어 있음 - 객체를 여러 개 만들고 저장하고 나갔다가 다시 들어오면 만들어진 객체가 자동으로 그룹화되어있음 2. 원인  1) SVG-edit에서는 레이어가 없으면 자동으로 아래 같은 구조로 레이어를 생성 <g class="layer"> <title>Layer 1</title> </g> 2) SVG-edit에서 편집한 내용을 CKEditor 저장할 때 CKEditor가 <title> 안의 내용을 지워버림(<title></title>). title 태그는 head 안에서만 사용할 수 있는 것 같다. 3) SVG-edit에서는 레이어 안의 title 태그로 레이어 제목을 찾아오는데, <title></title>로 저장된 상태에서는 제목을 못찾아와서 레이어가 없는 것으로 간주하고(orphan layer) 현재 만들어진 객체를 다 묶어서 레이어를 다시 생성함 => 객체가 다 그룹화되거나 변경한 id를 레이어가 덮어써버리는 문제 3. 해결시도 1) CKEDitor가 title 태그의 내용을 지우지 못하도록 한다   CKEditor 설정을 아래처럼 변경하면 된다고 해서 시도했으나 실패. window.CKEDITOR.config.allowedContent = true window.CKEDITOR.config.extraAllowedContent = 'title[*]' window.CKEDIT