@sveltia/cms 0.7.1 → 0.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +49 -49
- package/dist/sveltia-cms.js +251 -251
- package/package.json +16 -16
package/README.md
CHANGED
|
@@ -1,77 +1,81 @@
|
|
|
1
1
|
# Sveltia CMS
|
|
2
2
|
|
|
3
|
-
Sveltia CMS is a Git-based lightweight headless CMS under development as a drop-in replacement for [Netlify/Decap CMS](https://decapcms.org/). You can use it with any static site generator like SvelteKit, Eleventy, Next.js and Hugo to manage content as static files in a Git repository. The open source alternative to Netlify/Decap CMS is now in public beta — with more features to come.
|
|
3
|
+
Sveltia CMS is a Git-based lightweight headless CMS under development as a drop-in replacement for [Netlify/Decap CMS](https://decapcms.org/). You can use it with almost any static site generator like SvelteKit, Eleventy, Next.js and Hugo to manage content as static files in a Git repository. The open source alternative to Netlify/Decap CMS is now in public beta — with more features to come.
|
|
4
4
|
|
|
5
|
-
<br>
|
|
5
|
+
<br>
|
|
6
6
|
|
|
7
|
-
<br>
|
|
7
|
+
<br>
|
|
8
8
|
|
|
9
|
-
<br>
|
|
10
10
|
|
|
11
|
-
<br>
|
|
12
12
|
|
|
13
|
-
<br>
|
|
13
|
+
<br>
|
|
14
14
|
|
|
15
15
|
## Motivation
|
|
16
16
|
|
|
17
|
-
Sveltia CMS was born in November 2022, when the
|
|
17
|
+
Sveltia CMS was born in November 2022, when the progress of Netlify CMS was stalled for more than six months. [@kyoshino](https://github.com/kyoshino)’s clients wanted to replace their Netlify CMS instances without much effort, mainly to get better internationalization support.
|
|
18
18
|
|
|
19
|
-
|
|
19
|
+
To achieve radical improvements in UX, performance and i18n, it was decided to build an alternative from the ground up, while ensuring an easy migration path from the other. After proving the concept with a rapid [Svelte](https://svelte.dev/) prototype, development was accelerated to address their primary use cases. The new offering has since been released as open source software to encourage wider adoption.
|
|
20
20
|
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
Sveltia CMS is a Git-based lightweight headless CMS, which means:
|
|
21
|
+
Our goal is to make it a viable successor to Netlify CMS, expand the Git-based headless CMS market, empower small businesses and individuals who need a simple yet powerful CMS solution, and showcase the lightweight nature of the Svelte framework.
|
|
24
22
|
|
|
25
|
-
|
|
26
|
-
- Lightweight: The app is compiled as a single small JavaScript file served over a CDN. There’s no need to sign up for a service or install additional software.
|
|
27
|
-
- Headless: The CMS only takes care of raw data. You can read it and render the final content with your favourite framework.
|
|
23
|
+
## Features
|
|
28
24
|
|
|
29
25
|
Here are some highlights mainly compared to Netlify/Decap CMS:
|
|
30
26
|
|
|
31
27
|
### Compatible with Netlify/Decap CMS
|
|
32
28
|
|
|
33
|
-
- Ready to replace Netlify/Decap CMS _in some casual use case scenarios_ by updating
|
|
29
|
+
- Ready to replace Netlify/Decap CMS _in some casual use case scenarios_ by updating a single line of code.
|
|
34
30
|
- Existing [configuration files](https://decapcms.org/docs/configuration-options/) can be reused as is.
|
|
35
31
|
- Various features are still missing though — [see the compatibility chart below](#compatibility) for details.
|
|
36
32
|
|
|
37
33
|
### Better UX
|
|
38
34
|
|
|
39
|
-
- Created by an [experienced UX engineer](https://github.com/kyoshino) who loves code and design.
|
|
40
|
-
-
|
|
41
|
-
-
|
|
35
|
+
- Created and maintained by an [experienced UX engineer](https://github.com/kyoshino) who loves code and design. You can expect constant UX improvements.
|
|
36
|
+
- Offers a modern, intuitive UI, with some inspiration from the Netlify CMS v3 prototype[^1].
|
|
37
|
+
- Features an immersive dark mode[^2].
|
|
42
38
|
- The screenshots above are worth a thousand words!
|
|
43
39
|
|
|
44
40
|
### Better performance
|
|
45
41
|
|
|
46
|
-
- Built completely from scratch with Svelte
|
|
47
|
-
-
|
|
48
|
-
- Saving entries and
|
|
49
|
-
-
|
|
42
|
+
- Built completely from scratch with Svelte instead of forking React-based Netlify/Decap CMS. The app starts fast and stays fast. The compiled code is vanilla JavaScript — you can use it with almost any framework.
|
|
43
|
+
- Uses the GraphQL API for GitHub to quickly fetch content at once, so that entries and assets can be listed and searched instantly. This avoids the slowness and potential API rate limit violations caused by hundreds of requests with relation widgets[^14].
|
|
44
|
+
- Saving entries and assets is also much faster thanks to the [GraphQL mutation](https://github.blog/changelog/2021-09-13-a-simpler-api-for-authoring-commits/).
|
|
45
|
+
- Caches Git files locally to further speed up startup and reduce bandwidth.
|
|
50
46
|
- Small footprint: less than 300 KB when minified and gzipped, compared to 1.5 MB of Netlify/Decap CMS. And [no virtual DOM overhead](https://svelte.dev/blog/virtual-dom-is-pure-overhead).
|
|
51
47
|
|
|
52
48
|
### Better productivity
|
|
53
49
|
|
|
54
|
-
- You can [work on a local Git repository](#work-with-a-local-git-repository) without having to run a proxy server.
|
|
50
|
+
- You can [work on a local Git repository](#work-with-a-local-git-repository) without having to run a proxy server on your machine.
|
|
55
51
|
- You can delete multiple entries and assets at once.
|
|
56
|
-
-
|
|
52
|
+
- Provides some keyboard shortcuts for faster editing. More to come!
|
|
57
53
|
- Create a new entry: `Ctrl+E` (Windows/Linux) / `Command+E` (macOS)
|
|
58
54
|
- Save an entry: `Ctrl+S` (Windows/Linux) / `Command+S` (macOS)
|
|
59
55
|
- Search for entries and assets: `Ctrl+F` (Windows/Linux) / `Command+F` (macOS)
|
|
60
|
-
-
|
|
56
|
+
- Offers a UI optimized for tablet devices. Note that the UI is not yet optimized for smaller screens.
|
|
57
|
+
- Solves various outstanding Netlify/Decap CMS bugs[^11].
|
|
58
|
+
|
|
59
|
+
### Better accessibility
|
|
60
|
+
|
|
61
|
+
- Improved keyboard handling lets you efficiently navigate through UI elements using the Tab, Space, Enter and arrow keys[^17].
|
|
62
|
+
- Comprehensive [WAI-ARIA](https://w3c.github.io/aria/) support empowers users who rely on screen readers such as NVDA or VoiceOver.
|
|
63
|
+
- Honours your operating system’s [reduced motion](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion) and [reduced transparency](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-transparency) settings.
|
|
64
|
+
- We’ll continue to test and improve the application to meet [WCAG 2.2](https://w3c.github.io/wcag/guidelines/22/).
|
|
61
65
|
|
|
62
66
|
### Better i18n support
|
|
63
67
|
|
|
64
|
-
-
|
|
65
|
-
- Fields in non-default locales
|
|
66
|
-
- [
|
|
68
|
+
- It’s now easier to switch between locales while editing with just a click on a button instead of a dropdown list.
|
|
69
|
+
- Fields in non-default locales are validated as expected[^13].
|
|
70
|
+
- [Integrates DeepL](#use-deepl-to-translate-entry-fields) to allow translation of text fields from another locale with one click.
|
|
67
71
|
- You can [disable non-default locale content](#disable-non-default-locale-content)[^15].
|
|
68
|
-
- You can [use a random UUID for an entry slug](#use-a-random-id-for-an-entry-slug), which is a good option for locales
|
|
69
|
-
-
|
|
72
|
+
- You can [use a random UUID for an entry slug](#use-a-random-id-for-an-entry-slug), which is a good option for locales that write in non-Latin characters[^12].
|
|
73
|
+
- Resolves limitations in the Netlify/Decap CMS [list and object widgets](https://decapcms.org/docs/beta-features/#i18n-support) so that changes made with these widgets will be duplicated between locales as expected when using the `i18n: duplicate` field configuration[^7].
|
|
70
74
|
|
|
71
75
|
### Collection enhancements
|
|
72
76
|
|
|
73
77
|
- You can choose a [custom icon for each collection](#use-a-custom-icon-for-a-collection)[^3].
|
|
74
|
-
- A [per-collection media folder](#use-a-custom-media-folder-for-a-collection) will appear
|
|
78
|
+
- A [per-collection media folder](#use-a-custom-media-folder-for-a-collection) will appear next to the entries.
|
|
75
79
|
- String values in YAML files can be quoted with the new `yaml_quote: true` option for a collection, mainly for framework compatibility[^9].
|
|
76
80
|
|
|
77
81
|
### Field enhancements
|
|
@@ -95,7 +99,7 @@ While it’s not our goal to recreate all the features found in Netlify/Decap CM
|
|
|
95
99
|
| Feature | Status in Sveltia CMS |
|
|
96
100
|
| --- | --- |
|
|
97
101
|
| Installation | Installing with npm is not supported yet. |
|
|
98
|
-
| UI locales | Only English and Japanese are available at this time. No registration is needed. While the UI locale is automatically selected depending on the browser’s language settings, it can be changed in Settings. (Click on the Account button
|
|
102
|
+
| UI locales | Only English and Japanese are available at this time. No registration is needed. While the UI locale is automatically selected depending on the browser’s language settings, it can be changed in Settings. (Click on the Account button in the top right corner of the CMS.) |
|
|
99
103
|
| Account | Only the [GitHub backend](https://decapcms.org/docs/github-backend/) is available at this time. You can keep using Netlify or a [3rd party OAuth client](https://decapcms.org/docs/external-oauth-clients/) (or [our own](https://github.com/sveltia/sveltia-cms-auth)) to sign in with GitHub, just like Netlify/Decap CMS. The GitLab backend is coming soon. We plan to add the Test backend as well for our demo site, but Azure and Bitbucket are unlikely to be supported, mainly due to the lack of an API method to fetch content in bulk. Later we may implement a performant Git Gateway alternative using GraphQL. |
|
|
100
104
|
| Configuration | Supported. |
|
|
101
105
|
| Media | External media storage services are not supported yet. |
|
|
@@ -150,10 +154,6 @@ While it’s not our goal to recreate all the features found in Netlify/Decap CM
|
|
|
150
154
|
- Downloading an asset in the media library is not implemented yet.
|
|
151
155
|
- [Backend health check](https://www.githubstatus.com/api) is not implemented yet.
|
|
152
156
|
|
|
153
|
-
## Known issues
|
|
154
|
-
|
|
155
|
-
- Accessibility support is limited.
|
|
156
|
-
|
|
157
157
|
## Roadmap
|
|
158
158
|
|
|
159
159
|
- Further Netlify/Decap CMS compatibility, including Editorial Workflow
|
|
@@ -163,23 +163,20 @@ While it’s not our goal to recreate all the features found in Netlify/Decap CM
|
|
|
163
163
|
- Documentation
|
|
164
164
|
- Demo site
|
|
165
165
|
- Starter templates
|
|
166
|
-
|
|
167
|
-
### Non goals (for now)
|
|
168
|
-
|
|
169
166
|
- Mobile support
|
|
170
|
-
- WYSIWYG editing
|
|
171
167
|
|
|
172
168
|
## Getting started
|
|
173
169
|
|
|
174
170
|
### New users
|
|
175
171
|
|
|
176
|
-
Currently, Sveltia CMS is aimed at existing Netlify/Decap CMS users. If you don’t have it yet, follow [their documentation](https://decapcms.org/docs/add-to-your-site/) to add it to your site first. Then migrate to Sveltia CMS as described below.
|
|
172
|
+
Currently, Sveltia CMS is aimed at existing Netlify/Decap CMS users. If you don’t have it yet, follow [their documentation](https://decapcms.org/docs/add-to-your-site/) to add it to your site and create a configuration file first. Then migrate to Sveltia CMS as described below.
|
|
177
173
|
|
|
178
|
-
As the product evolves, we’ll implement
|
|
174
|
+
As the product evolves, we’ll implement a built-in configuration editor and provide comprehensive documentation to make it easier for everyone to get started with Sveltia CMS.
|
|
179
175
|
|
|
180
|
-
Here are some starter
|
|
176
|
+
Here are some starter kits for popular frameworks created by community members. More to follow!
|
|
181
177
|
|
|
182
|
-
- [Eleventy](https://github.com/danurbanowicz/eleventy-sveltia-cms-starter) by [@danurbanowicz](https://github.com/danurbanowicz)
|
|
178
|
+
- [Eleventy starter template](https://github.com/danurbanowicz/eleventy-sveltia-cms-starter) by [@danurbanowicz](https://github.com/danurbanowicz)
|
|
179
|
+
- [Hugo module](https://github.com/privatemaker/headless-cms) by [@privatemaker](https://github.com/privatemaker)
|
|
183
180
|
|
|
184
181
|
### Migration
|
|
185
182
|
|
|
@@ -202,7 +199,7 @@ You can host your Sveltia CMS-managed site anywhere, such as [Cloudflare Pages](
|
|
|
202
199
|
|
|
203
200
|
### Work with a local Git repository
|
|
204
201
|
|
|
205
|
-
You can use Sveltia CMS with a local Git repository,
|
|
202
|
+
You can use Sveltia CMS with a local Git repository, like the [beta feature](https://decapcms.org/docs/beta-features/#working-with-a-local-git-repository) in Netlify/Decap CMS, but Sveltia CMS has simplified the workflow by removing the need for additional configuration (the `local_backend` property) and proxy server, thanks to the [File System Access API](https://developer.chrome.com/articles/file-system-access/) available in [some modern browsers](https://developer.mozilla.org/en-US/docs/web/api/window/showopenfilepicker#browser_compatibility).
|
|
206
203
|
|
|
207
204
|
1. Launch the local development server for your frontend framework, typically with `npm run dev` or `pnpm dev`.
|
|
208
205
|
1. Visit `http://localhost:[port]/admin/index.html` with Chrome or Edge. The port number varies by framework.
|
|
@@ -256,19 +253,21 @@ In Sveltia CMS, those per-collection media folders are displayed prominently for
|
|
|
256
253
|
Sveltia CMS comes with a handy DeepL integration so that you can translate any text field from another locale without leaving the content editor. To enable the high-quality, quick translation feature:
|
|
257
254
|
|
|
258
255
|
1. Sign up for [DeepL API](https://www.deepl.com/pro-api/) and copy your Authentication Key from DeepL’s Account page.
|
|
259
|
-
1. Go back to Sveltia CMS, click on the Account button
|
|
256
|
+
1. Go back to Sveltia CMS, click on the Account button in the top right corner, then click Settings.
|
|
260
257
|
1. Paste your key to the DeepL API Authentication Key field, and close the Settings dialog.
|
|
261
258
|
1. Open any entry, and you can now translate all fields or individual fields by selecting Translate from the three-dot menu.
|
|
262
259
|
1. If you have upgraded to DeepL API Pro, provide your new Authentication Key in the same way.
|
|
263
260
|
|
|
264
261
|
### Disable non-default locale content
|
|
265
262
|
|
|
266
|
-
You can now disable
|
|
263
|
+
You can now disable output of content in selected non-default locales by adding the `save_all_locales` property to the top-level or per-collection `i18n` configuration. Then you’ll find “Disable (locale name)” in the three-dot menu in the top right corner of the content editor. This is useful if the translation isn’t ready yet, but you want to publish the default locale content first.
|
|
264
|
+
|
|
265
|
+
With the following configuration, you can disable the French and/or German translation while writing in English.
|
|
267
266
|
|
|
268
267
|
```diff
|
|
269
268
|
i18n:
|
|
270
269
|
structure: multiple_files
|
|
271
|
-
locales: [en, fr]
|
|
270
|
+
locales: [en, fr, de]
|
|
272
271
|
default_locale: en
|
|
273
272
|
+ save_all_locales: false
|
|
274
273
|
```
|
|
@@ -354,7 +353,7 @@ Want to build a website with Sveltia CMS? [@kyoshino](https://github.com/kyoshin
|
|
|
354
353
|
|
|
355
354
|
## Contributions
|
|
356
355
|
|
|
357
|
-
Sveltia CMS is still in early beta, so we do expect various problems. Please [report any bugs to us](https://github.com/sveltia/sveltia-cms/issues/new). Feel free to submit feature requests as well. Meanwhile, pull requests may not be accepted for the time being due to limited review resources. As we get closer to the 1.0 release, we’ll be welcoming
|
|
356
|
+
Sveltia CMS is still in early beta, so we do expect various problems. Please [report any bugs to us](https://github.com/sveltia/sveltia-cms/issues/new). Feel free to submit feature requests as well. Meanwhile, pull requests may not be accepted for the time being due to limited review resources. As we get closer to the 1.0 release, we’ll be welcoming localizers.
|
|
358
357
|
|
|
359
358
|
## Related Links
|
|
360
359
|
|
|
@@ -380,3 +379,4 @@ This software is provided “as is” without any express or implied warranty. T
|
|
|
380
379
|
[^14]: [Netlify/Decap CMS #4635](https://github.com/decaporg/decap-cms/issues/4635), [Netlify/Decap CMS #5920](https://github.com/decaporg/decap-cms/issues/5920), [Netlify/Decap CMS #6410](https://github.com/decaporg/decap-cms/issues/6410)
|
|
381
380
|
[^15]: [Netlify/Decap CMS #6932](https://github.com/decaporg/decap-cms/issues/6932)
|
|
382
381
|
[^16]: [Netlify/Decap CMS #2103](https://github.com/decaporg/decap-cms/issues/2103)
|
|
382
|
+
[^17]: [Netlify/Decap CMS #1333](https://github.com/decaporg/decap-cms/issues/1333)
|