Skip to content

Commit ca00486

Browse files
susnuxAntreesy
authored andcommitted
feat: Allow to import without dist
The individual import path of components, composables, directives, and functions was changed. The type of import is (e.g. `components`) is now lowercase and the `dist` will be omitted. Signed-off-by: Ferdinand Thiessen <[email protected]>
1 parent 534ca1b commit ca00486

15 files changed

+44
-16
lines changed

CHANGELOG.md

+12
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,18 @@
55

66
# Changelog
77

8+
## [v8.23.0](https://github.com/nextcloud-libraries/nextcloud-vue/tree/v8.23.0) (UNRELEASED)
9+
[Full Changelog](https://github.com/nextcloud-libraries/nextcloud-vue/compare/v8.22.0...v8.23.0)
10+
11+
### 🚀 Enhancements
12+
* The individual import path of components, composables, directives, and functions was changed.
13+
The type of import is (e.g. `components`) is now lowercase and the `dist` will be omitted.
14+
For example to import the `NcButton` component the path has changed:
15+
- from `import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'`.
16+
- to `import NcButton from '@nextcloud/vue/components/NcButton'`
17+
18+
The old import paths are still valid, but deprecated and will be removed in version 9.
19+
820
## [v8.22.0](https://github.com/nextcloud-libraries/nextcloud-vue/tree/v8.22.0) (2024-12-20)
921
[Full Changelog](https://github.com/nextcloud-libraries/nextcloud-vue/compare/v8.21.0...v8.22.0)
1022

docs/composables.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
To use any composable, import and use it according to documentation or Vue guidelines, for example:
99

1010
```js static
11-
import { useIsMobile } from '@nextcloud/vue/dist/composables/useIsMobile.js'
11+
import { useIsMobile } from '@nextcloud/vue/composables/useIsMobile'
1212

1313
export default {
1414
setup() {
@@ -21,7 +21,7 @@ export default {
2121
or in `<script setup>`:
2222

2323
```js static
24-
import { useIsMobile } from '@nextcloud/vue/dist/composables/useIsMobile.js'
24+
import { useIsMobile } from '@nextcloud/vue/composables/useIsMobile'
2525

2626
const isMobile = useIsMobile()
2727
```

docs/composables/useHotKey.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ It respects Nextcloud's value of ```OCP.Accessibility.disableKeyboardShortcuts``
88

99
### Usage
1010
```js static
11-
import { useHotKey } from '@nextcloud/vue/dist/Composables/useHotKey/index.js'
11+
import { useHotKey } from '@nextcloud/vue/composables/useHotKey'
1212

1313
const stopCallback = useHotKey(key, callback, options)
1414
```

docs/composables/useIsDarkTheme.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
import {
88
useIsDarkTheme,
99
useIsDarkThemeElement,
10-
} from '@nextcloud/vue/dist/Composables/useIsDarkTheme.js'
10+
} from '@nextcloud/vue/composables/useIsDarkTheme'
1111
```
1212

1313
Same as `isDarkTheme` functions, but with reactivity.

docs/directives.md

+3-3
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
To use any directive, import and register it locally, for example:
99

1010
```js static
11-
import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip.js'
11+
import Tooltip from '@nextcloud/vue/directives/Tooltip'
1212

1313
export default {
1414
directives: {
@@ -19,13 +19,13 @@ export default {
1919
or in `<script setup>`:
2020

2121
```js static
22-
import vTooltip from '@nextcloud/vue/dist/Directives/Tooltip.js'
22+
import vTooltip from '@nextcloud/vue/directives/Tooltip'
2323
```
2424

2525
You can also register any directive globally. But it is not recommended.
2626

2727
```js static
28-
import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip.js'
28+
import Tooltip from '@nextcloud/vue/directives/Tooltip'
2929

3030
Vue.directive('Tooltip', Tooltip)
3131
```

docs/directives/focus.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
-->
55

66
```js static
7-
import Focus from '@nextcloud/vue/dist/Directives/Focus.js'
7+
import Focus from '@nextcloud/vue/directives/Focus'
88
```
99

1010
Focus an element when it is mounted to DOM.

docs/directives/linkify.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
-->
55

66
```js static
7-
import Linkify from '@nextcloud/vue/dist/Directives/Linkify.js'
7+
import Linkify from '@nextcloud/vue/directives/Linkify'
88
```
99

1010
Automatically make links in rendered text clickable.

docs/directives/tooltip.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
-->
55

66
```js static
7-
import Tooltip from '@nextcloud/vue/dist/Directives/Tooltip.js'
7+
import Tooltip from '@nextcloud/vue/directives/Tooltip'
88
```
99

1010
Tooltip directive based on [v-tooltip](https://github.com/Akryum/v-tooltip).

docs/functions/a11y.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
- SPDX-License-Identifier: AGPL-3.0-or-later
44
-->
55
```js static
6-
import { isA11yActivation } from '@nextcloud/vue/dist/Functions/a11y.js'
6+
import { isA11yActivation } from '@nextcloud/vue/functions/a11y'
77
```
88

99
## Definitions

docs/functions/emoji.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import {
99
emojiAddRecent,
1010
getCurrentSkinTone,
1111
setCurrentSkinTone,
12-
} from '@nextcloud/vue/dist/Functions/emoji.js'
12+
} from '@nextcloud/vue/functions/emoji'
1313
```
1414

1515
## Definitions

docs/functions/isDarkTheme.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
import {
88
isDarkTheme,
99
checkIfDarkTheme,
10-
} from '@nextcloud/vue/dist/Functions/isDarkTheme.js'
10+
} from '@nextcloud/vue/functions/isDarkTheme'
1111
```
1212

1313
Check whether the dark theme is enabled in Nextcloud.

docs/functions/spawnDialog.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
```ts static
66
import {
77
spawnDialog,
8-
} from '@nextcloud/vue/dist/Functions/dialog.js'
8+
} from '@nextcloud/vue/functions/dialog'
99
```
1010

1111
## Definitions

docs/functions/usernameToColor.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
- SPDX-License-Identifier: AGPL-3.0-or-later
44
-->
55
```js static
6-
import usernameToColor from '@nextcloud/vue/dist/Functions/usernameToColor.js'
6+
import usernameToColor from '@nextcloud/vue/functions/usernameToColor'
77
```
88

99
## Definition

docs/index.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ You can also import individual module without bundling the full library.
3333

3434

3535
```js static
36-
import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar'
36+
import NcAvatar from '@nextcloud/vue/components/NcAvatar'
3737
```
3838

3939
## Recommendations

package.json

+16
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,22 @@
5555
"./dist/Composables/*.js": {
5656
"import": "./dist/Composables/*.mjs",
5757
"require": "./dist/Composables/*.cjs"
58+
},
59+
"./components/*": {
60+
"import": "./dist/Components/*.mjs",
61+
"require": "./dist/Components/*.cjs"
62+
},
63+
"./composables/*": {
64+
"import": "./dist/Composables/*.mjs",
65+
"require": "./dist/Composables/*.cjs"
66+
},
67+
"./directives/*": {
68+
"import": "./dist/Directives/*.mjs",
69+
"require": "./dist/Directives/*.cjs"
70+
},
71+
"./functions/*": {
72+
"import": "./dist/Functions/*.mjs",
73+
"require": "./dist/Functions/*.cjs"
5874
}
5975
},
6076
"files": [

0 commit comments

Comments
 (0)