diff --git a/package.json b/package.json
index 5d7b321a4..576fa7a71 100644
--- a/package.json
+++ b/package.json
@@ -17,9 +17,9 @@
 	"license": "agpl",
 	"private": true,
 	"scripts": {
-		"dev": "webpack --config webpack.dev.js",
-		"watch": "webpack --progress --watch --config webpack.dev.js",
-		"build": "webpack --progress --hide-modules --config webpack.prod.js",
+		"dev": "NODE_ENV=development webpack --config webpack.dev.js",
+		"watch": "NODE_ENV=development webpack --progress --watch --config webpack.dev.js",
+		"build": "NODE_ENV=production webpack --progress --hide-modules --config webpack.prod.js",
 		"lint": "eslint --ext .js,.vue src",
 		"lint:fix": "eslint --ext .js,.vue src --fix",
 		"test": "jest",
@@ -39,7 +39,6 @@
 		"vue": "^2.6.11",
 		"vue-at": "^2.5.0-beta.2",
 		"vue-click-outside": "^1.0.7",
-		"vue-color": "^2.7.0",
 		"vue-easymde": "^1.0.1",
 		"vue-infinite-loading": "^2.4.4",
 		"vue-router": "^3.1.5",
diff --git a/src/components/board/BoardSidebar.vue b/src/components/board/BoardSidebar.vue
index c7a03e1b3..ba58d0295 100644
--- a/src/components/board/BoardSidebar.vue
+++ b/src/components/board/BoardSidebar.vue
@@ -62,8 +62,7 @@ import SharingTabSidebar from './SharingTabSidebar'
 import TagsTabSidebar from './TagsTabSidebar'
 import DeletedTabSidebar from './DeletedTabSidebar'
 import TimelineTabSidebar from './TimelineTabSidebar'
-import { AppSidebar } from '@nextcloud/vue/dist/Components/AppSidebar'
-import { AppSidebarTab } from '@nextcloud/vue/dist/Components/AppSidebarTab'
+import { AppSidebar, AppSidebarTab } from '@nextcloud/vue'
 
 export default {
 	name: 'BoardSidebar',
diff --git a/src/components/board/SharingTabSidebar.vue b/src/components/board/SharingTabSidebar.vue
index d31ea8619..53bb7e402 100644
--- a/src/components/board/SharingTabSidebar.vue
+++ b/src/components/board/SharingTabSidebar.vue
@@ -58,11 +58,7 @@
 </template>
 
 <script>
-import { Avatar } from '@nextcloud/vue/dist/Components/Avatar'
-import { Multiselect } from '@nextcloud/vue/dist/Components/Multiselect'
-import { Actions } from '@nextcloud/vue/dist/Components/Actions'
-import { ActionButton } from '@nextcloud/vue/dist/Components/ActionButton'
-import { ActionCheckbox } from '@nextcloud/vue/dist/Components/ActionCheckbox'
+import { Avatar, Multiselect, Actions, ActionButton, ActionCheckbox } from '@nextcloud/vue'
 import { CollectionList } from 'nextcloud-vue-collections'
 import { mapGetters } from 'vuex'
 import { getCurrentUser } from '@nextcloud/auth'
diff --git a/src/components/board/Stack.vue b/src/components/board/Stack.vue
index 14cbbe2af..13be4a47c 100644
--- a/src/components/board/Stack.vue
+++ b/src/components/board/Stack.vue
@@ -82,8 +82,7 @@
 
 import { mapGetters } from 'vuex'
 import { Container, Draggable } from 'vue-smooth-dnd'
-import { Actions } from '@nextcloud/vue/dist/Components/Actions'
-import { ActionButton } from '@nextcloud/vue/dist/Components/ActionButton'
+import { Actions, ActionButton } from '@nextcloud/vue'
 import CardItem from '../cards/CardItem'
 
 export default {
diff --git a/src/components/board/TagsTabSidebar.vue b/src/components/board/TagsTabSidebar.vue
index f4d076118..90fdb8973 100644
--- a/src/components/board/TagsTabSidebar.vue
+++ b/src/components/board/TagsTabSidebar.vue
@@ -66,7 +66,7 @@
 
 import { mapGetters } from 'vuex'
 import Color from '../../mixins/color'
-import { ColorPicker } from '@nextcloud/vue/dist/Components/ColorPicker'
+import { ColorPicker } from '@nextcloud/vue'
 
 export default {
 	name: 'TagsTabSidebar',
diff --git a/src/components/boards/BoardItem.vue b/src/components/boards/BoardItem.vue
index 367fa08a6..2ebbeefad 100644
--- a/src/components/boards/BoardItem.vue
+++ b/src/components/boards/BoardItem.vue
@@ -45,7 +45,7 @@
 </template>
 
 <script>
-import { Avatar } from '@nextcloud/vue/dist/Components/Avatar'
+import { Avatar } from '@nextcloud/vue'
 
 export default {
 	name: 'BoardItem',
diff --git a/src/components/card/CardSidebar.vue b/src/components/card/CardSidebar.vue
index 6931d6374..6a8e2b0fd 100644
--- a/src/components/card/CardSidebar.vue
+++ b/src/components/card/CardSidebar.vue
@@ -144,18 +144,11 @@
 </template>
 
 <script>
-import { Avatar } from '@nextcloud/vue/dist/Components/Avatar'
-import { Multiselect } from '@nextcloud/vue/dist/Components/Multiselect'
-import { AppSidebar } from '@nextcloud/vue/dist/Components/AppSidebar'
-import { AppSidebarTab } from '@nextcloud/vue/dist/Components/AppSidebarTab'
-import { DatetimePicker } from '@nextcloud/vue/dist/Components/DatetimePicker'
+import { Avatar, Actions, ActionButton, Multiselect, AppSidebar, AppSidebarTab, DatetimePicker } from '@nextcloud/vue'
 import { mapState, mapGetters } from 'vuex'
 import VueEasymde from 'vue-easymde/dist/VueEasyMDE.common'
-import { Actions } from '@nextcloud/vue/dist/Components/Actions'
-import { ActionButton } from '@nextcloud/vue/dist/Components/ActionButton'
 import Color from '../../mixins/color'
 import { CollectionList } from 'nextcloud-vue-collections'
-
 import CardSidebarTabAttachments from './CardSidebarTabAttachments'
 import CardSidebarTabComments from './CardSidebarTabComments'
 import CardSidebarTabActivity from './CardSidebarTabActivity'
diff --git a/src/components/cards/AvatarList.vue b/src/components/cards/AvatarList.vue
index 26c2efdaf..6b58125a0 100644
--- a/src/components/cards/AvatarList.vue
+++ b/src/components/cards/AvatarList.vue
@@ -39,9 +39,8 @@
 </template>
 
 <script>
-import Avatar from '@nextcloud/vue/dist/Components/Avatar'
-import PopoverMenu from '@nextcloud/vue/dist/Components/PopoverMenu'
-import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip'
+import { Avatar, PopoverMenu, Tooltip } from '@nextcloud/vue'
+
 export default {
 	name: 'AvatarList',
 	components: {
diff --git a/src/components/cards/CardItem.vue b/src/components/cards/CardItem.vue
index 97c7169da..a624bedf4 100644
--- a/src/components/cards/CardItem.vue
+++ b/src/components/cards/CardItem.vue
@@ -98,10 +98,7 @@
 </template>
 
 <script>
-import { Modal } from '@nextcloud/vue/dist/Components/Modal'
-import { Actions } from '@nextcloud/vue/dist/Components/Actions'
-import { ActionButton } from '@nextcloud/vue/dist/Components/ActionButton'
-import { Multiselect } from '@nextcloud/vue/dist/Components/Multiselect'
+import { Modal, Actions, ActionButton, Multiselect } from '@nextcloud/vue'
 import ClickOutside from 'vue-click-outside'
 import { mapState, mapGetters } from 'vuex'
 import axios from '@nextcloud/axios'
diff --git a/src/components/navigation/AppNavigation.vue b/src/components/navigation/AppNavigation.vue
index e85de43c2..2e48baa6c 100644
--- a/src/components/navigation/AppNavigation.vue
+++ b/src/components/navigation/AppNavigation.vue
@@ -69,7 +69,7 @@
 import axios from '@nextcloud/axios'
 import { mapGetters } from 'vuex'
 import ClickOutside from 'vue-click-outside'
-import { Multiselect } from '@nextcloud/vue/dist/Components/Multiselect'
+import { Multiselect } from '@nextcloud/vue'
 
 import AppNavigationAddBoard from './AppNavigationAddBoard'
 import AppNavigationBoardCategory from './AppNavigationBoardCategory'
diff --git a/src/components/navigation/AppNavigationAddBoard.vue b/src/components/navigation/AppNavigationAddBoard.vue
index 8184c9f16..31ce5be49 100644
--- a/src/components/navigation/AppNavigationAddBoard.vue
+++ b/src/components/navigation/AppNavigationAddBoard.vue
@@ -47,7 +47,8 @@
 </template>
 
 <script>
-import { ColorPicker } from '@nextcloud/vue/dist/Components/ColorPicker'
+import { ColorPicker } from '@nextcloud/vue'
+
 export default {
 	name: 'AppNavigationAddBoard',
 	components: { ColorPicker },
diff --git a/src/components/navigation/AppNavigationBoard.vue b/src/components/navigation/AppNavigationBoard.vue
index 4b6b4b8f0..8f9ab828c 100644
--- a/src/components/navigation/AppNavigationBoard.vue
+++ b/src/components/navigation/AppNavigationBoard.vue
@@ -77,9 +77,8 @@
 </template>
 
 <script>
-import { PopoverMenu } from '@nextcloud/vue/dist/Components/PopoverMenu'
+import { PopoverMenu, ColorPicker } from '@nextcloud/vue'
 import ClickOutside from 'vue-click-outside'
-import { ColorPicker } from '@nextcloud/vue/dist/Components/ColorPicker'
 
 export default {
 	name: 'AppNavigationBoard',
diff --git a/src/main.js b/src/main.js
index 8869424d9..66f4b66c0 100644
--- a/src/main.js
+++ b/src/main.js
@@ -26,7 +26,7 @@ import store from './store/main'
 import { sync } from 'vuex-router-sync'
 import { translate, translatePlural } from '@nextcloud/l10n'
 import { generateFilePath } from '@nextcloud/router'
-import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip'
+import Tooltip from '@nextcloud/vue'
 import ClickOutside from 'vue-click-outside'
 import './models'