[WIP] Use FontAwesome Component for Vue (#3127)

* wip

* Rename

* Clean up

* Clean up

* wip

* wip

* Enable tree shaking

* :v:

* :v:

* wip

* wip

* Clean up

1 files changed, 97 insertions, 2 deletions

diff --git a/src/client/app/init.ts b/src/client/app/init.ts
index d027a70597..bc5a349987 100644
--- a/src/client/app/init.ts
+++ b/src/client/app/init.ts
@@ -5,7 +5,6 @@
 import Vue from 'vue';
 import Vuex from 'vuex';
 import VueRouter from 'vue-router';
-import * as TreeView from 'vue-json-tree-view';
 import VAnimateCss from 'v-animate-css';
 import VModal from 'vue-js-modal';
 import VueSweetalert2 from 'vue-sweetalert2';
@@ -21,14 +20,110 @@ if (localStorage.getItem('theme') == null) {
 	applyTheme(lightTheme);
 }
 
+//#region FontAwesome
+import { library } from '@fortawesome/fontawesome-svg-core';
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
+
+/* なぜか動かない
+import faRetweet from '@fortawesome/free-solid-svg-icons/faRetweet';
+import faPlus from '@fortawesome/free-solid-svg-icons/faPlus';
+import faUser from '@fortawesome/free-solid-svg-icons/faUser';
+import faCog from '@fortawesome/free-solid-svg-icons/faCog';
+import faCheck from '@fortawesome/free-solid-svg-icons/faCheck';
+import faStar from '@fortawesome/free-solid-svg-icons/faStar';
+import faReply from '@fortawesome/free-solid-svg-icons/faReply';
+import faEllipsisH from '@fortawesome/free-solid-svg-icons/faEllipsisH';
+import faQuoteLeft from '@fortawesome/free-solid-svg-icons/faQuoteLeft';
+import faQuoteRight from '@fortawesome/free-solid-svg-icons/faQuoteRight';
+import faAngleUp from '@fortawesome/free-solid-svg-icons/faAngleUp';
+import faAngleDown from '@fortawesome/free-solid-svg-icons/faAngleDown';
+import faAt from '@fortawesome/free-solid-svg-icons/faAt';
+import faHashtag from '@fortawesome/free-solid-svg-icons/faHashtag';
+import faHome from '@fortawesome/free-solid-svg-icons/faHome';
+import faGlobe from '@fortawesome/free-solid-svg-icons/faGlobe';
+import faCircle from '@fortawesome/free-solid-svg-icons/faCircle';
+import faList from '@fortawesome/free-solid-svg-icons/faList';
+import faHeart from '@fortawesome/free-solid-svg-icons/faHeart';
+import faUnlock from '@fortawesome/free-solid-svg-icons/faUnlock';
+import faRssSquare from '@fortawesome/free-solid-svg-icons/faRssSquare';
+import faSort from '@fortawesome/free-solid-svg-icons/faSort';
+import faChartPie from '@fortawesome/free-solid-svg-icons/faChartPie';
+import faChartBar from '@fortawesome/free-solid-svg-icons/faChartBar';
+import faPencilAlt from '@fortawesome/free-solid-svg-icons/faPencilAlt';
+import faColumns from '@fortawesome/free-solid-svg-icons/faColumns';
+import faComments from '@fortawesome/free-solid-svg-icons/faComments';
+import faGamepad from '@fortawesome/free-solid-svg-icons/faGamepad';
+import faCloud from '@fortawesome/free-solid-svg-icons/faCloud';
+import faPowerOff from '@fortawesome/free-solid-svg-icons/faPowerOff';
+import faChevronCircleLeft from '@fortawesome/free-solid-svg-icons/faChevronCircleLeft';
+import faChevronCircleRight from '@fortawesome/free-solid-svg-icons/faChevronCircleRight';
+import faShareAlt from '@fortawesome/free-solid-svg-icons/faShareAlt';
+import faTimes from '@fortawesome/free-solid-svg-icons/faTimes';
+import faThumbtack from '@fortawesome/free-solid-svg-icons/faThumbtack';
+import faSearch from '@fortawesome/free-solid-svg-icons/faSearch';
+
+import farBell from '@fortawesome/free-regular-svg-icons/faBell';
+import farEnvelope from '@fortawesome/free-regular-svg-icons/faEnvelope';
+import farComments from '@fortawesome/free-regular-svg-icons/faComments';
+
+library.add(
+	faRetweet,
+	faPlus,
+	faUser,
+	faCog,
+	faCheck,
+	faStar,
+	faReply,
+	faEllipsisH,
+	faQuoteLeft,
+	faQuoteRight,
+	faAngleUp,
+	faAngleDown,
+	faAt,
+	faHashtag,
+	faHome,
+	faGlobe,
+	faCircle,
+	faList,
+	faHeart,
+	faUnlock,
+	faRssSquare,
+	faSort,
+	faChartPie,
+	faChartBar,
+	faPencilAlt,
+	faColumns,
+	faComments,
+	faGamepad,
+	faCloud,
+	faPowerOff,
+	faChevronCircleLeft,
+	faChevronCircleRight,
+	faShareAlt,
+	faTimes,
+	faThumbtack,
+	faSearch,
+	farBell,
+	farEnvelope,
+	farComments,
+);
+*/
+
+import { fas } from '@fortawesome/free-solid-svg-icons';
+import { far } from '@fortawesome/free-regular-svg-icons';
+
+library.add(fas, far);
+//#endregion
+
 Vue.use(Vuex);
 Vue.use(VueRouter);
-Vue.use(TreeView);
 Vue.use(VAnimateCss);
 Vue.use(VModal);
 Vue.use(VueHotkey);
 Vue.use(VueSweetalert2);
 
+Vue.component('fa', FontAwesomeIcon);
+
 // Register global directives
 require('./common/views/directives');