#491 커뮤니티 게시글 에디터 적용 (#504)

* tiptap관련 라이브러리 babel 변환적용

* 게시글 에디터 tiptap 관련 라이브러리 추가

* 커뮤니티 내용 미리보기에 html형식 적용

* 게시글 생성페이지에 에디터 적용

* 게시글 수정, 상세보기 페이지에  WYSIWYG 적용

* babel 설정 include, exclude관련 주석 추가

* tiptap 에디터 컴포넌트 분리

* tiptap 에디터 리팩토링

Author: banchan01

frontend/build/webpack.base.conf.js

@@ -80,8 +80,10 @@ module.exports = {
       {
         test: /\.js$/,
         loader: 'babel-loader?cacheDirectory=true',
-        exclude: /node_modules/,
-        include: [resolve('src'), resolve('test')]
+        // include -> inclue 안에 있는 모듈 '만' babel이 로드 합니다.
+        // exclude -> exclude 안에 있는 모듈 '만' babel 로드 시 제외 합니다.
+        // 따라서 현재 include 안에 node_modules 가 없으므로, node_modules 안의 파일은 babel이 로드하지 않습니다.
+        include: [resolve('src'), resolve('test'), resolve('node_modules/tiptap'), resolve('node_modules/tiptap-extensions'), resolve('node_modules/prosemirror-tables'), resolve('node_modules/prosemirror-utils')]
       },
       {
         test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,

frontend/package.json

@@ -33,6 +33,8 @@
     "tar-simditor": "^3.0.5",
     "tar-simditor-markdown": "^1.2.3",
     "thememirror": "^2.0.1",
+    "tiptap": "^1.32.2",
+    "tiptap-extensions": "^1.35.2",
     "vue": "^2.5.16",
     "vue-analytics": "^5.10.4",
     "vue-clipboard2": "^0.2.1",