Merge pull request #18 from laruiss/develop

develop

Author: laruiss

.github/workflows/release-please.yml

@@ -0,0 +1,38 @@
+name: Release Please
+
+on:
+  push:
+    branches:
+      - main
+
+permissions:
+  contents: write
+  pull-requests: write
+
+jobs:
+  release-please:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Release Please
+        id: release
+        uses: google-github-actions/release-please-action@v4
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          release-type: node
+          target-branch: main
+      - name: Checkout repository
+        uses: actions/checkout@v4
+        if: ${{ steps.release.outputs.release_created }}
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          registry-url: 'https://registry.npmjs.org'
+        if: ${{ steps.release.outputs.release_created }}
+      - run: npm ci --legacy-peer-deps
+        if: ${{ steps.release.outputs.release_created }}
+      - run: npm run dev:prepare
+        if: ${{ steps.release.outputs.release_created }}
+      - run: npm run release
+        if: ${{ steps.release.outputs.release_created }}
+        env:
+          NPM_TOKEN: ${{secrets.NPM_TOKEN}}

.npmrc

@@ -1,2 +1,5 @@
+//registry.npmjs.com/:_authToken=${NPM_TOKEN}
+access=public
+always-auth=true
 shamefully-hoist=true
 strict-peer-dependencies=false

.release-please-manifest.json

@@ -0,0 +1,3 @@
+{
+  ".": "1.0.0"
+}

README.md

@@ -1,58 +1,105 @@
-<!--
-Get your module up and running quickly.
-
-Find and replace all on all files (CMD+SHIFT+F):
-- Name: My Module
-- Package name: my-module
-- Description: My new Nuxt module
--->
-
-# My Module
+# Module VueDsfr pour Nuxt
 
 [![npm version][npm-version-src]][npm-version-href]
 [![npm downloads][npm-downloads-src]][npm-downloads-href]
 [![License][license-src]][license-href]
 [![Nuxt][nuxt-src]][nuxt-href]
 
-My new Nuxt module for doing amazing things.
+Ce module facilite l’utilisation de la bibliothèque VueDsfr dans un projet Nuxt 3.
 
-- [✨ &nbsp;Release Notes](/CHANGELOG.md)
-<!-- - [🏀 Online playground](https://stackblitz.com/github/your-org/my-module?file=playground%2Fapp.vue) -->
-<!-- - [📖 &nbsp;Documentation](https://example.com) -->
+- [✨ Release Notes](/CHANGELOG.md)
+- [🏀 Online playground](https://stackblitz.com/github/laruiss/vue-dsfr-nuxt-module?file=playground%2Fapp.vue)
+- [📖 Documentation](https://docs.vue-ds.fr/nuxt)
 
 ## Features
 
 <!-- Highlight some of the features your module provide here -->
-- ⛰ &nbsp;Foo
-- 🚠 &nbsp;Bar
-- 🌲 &nbsp;Baz
+- 🪄 Imports automagiques des composables VueDsfr
+- 🪄 Imports automagiques des composants VueDsfr
+- ✨ Facilitation de l’utilisation des icônes de [Oh, Vue Icons](https://oh-vue-icons.netlify.app/)
 
-## Quick Setup
+## Configuration rapide
 
-1. Add `my-module` dependency to your project
+1. Ajouter la dépendance `vue-dsfr-nuxt-module` au projet
 
 ```bash
-# Using pnpm
-pnpm add -D my-module
+# Avec pnpm
+pnpm add -D vue-dsfr-nuxt-module
 
-# Using yarn
-yarn add --dev my-module
+# Avec yarn
+yarn add --dev vue-dsfr-nuxt-module
 
-# Using npm
-npm install --save-dev my-module
+# Avec npm
+npm i -D vue-dsfr-nuxt-module
 ```
 
-2. Add `my-module` to the `modules` section of `nuxt.config.ts`
+N.B. : Vous devriez déjà avoir les dépendances `@gouvminint/vue-dsfr` et `@gouvfr/dsfr`
+
+2. Ajouter `vue-dsfr-nuxt-module` dans la section `modules` de `nuxt.config.ts`
 
-```js
+```ts
 export default defineNuxtConfig({
   modules: [
-    'my-module'
+    'vue-dsfr-nuxt-module'
   ]
 })
 ```
 
-That's it! You can now use My Module in your Nuxt app ✨
+3. Ajouter le CSS de DSFR dans la section `css` de `nuxt.config.ts`
+
+Rappel : Vous devriez déjà avoir les dépendances `@gouvminint/vue-dsfr` et `@gouvfr/dsfr`
+
+```ts
+export default defineNuxtConfig({
+  modules: [
+    'vue-dsfr-nuxt-module'
+  ],
+  css: [
+    '@gouvfr/dsfr/dist/core/core.main.min.css',           // Le CSS minimal du DSFR
+    '@gouvfr/dsfr/dist/component/component.main.min.css', // Styles de tous les composants du DSFR
+    '@gouvfr/dsfr/dist/utility/utility.main.min.css',     // Classes utilitaires : les composants de VueDsfr en ont besoin, contient aussi les icônes
+
+    '@gouvfr/dsfr/dist/scheme/scheme.min.css',            // Facultatif : Si les thèmes sont utilisés (thème sombre, thème en bernes)
+  ],
+})
+```
+
+4. Facultatif : ajouter des icônes à utiliser avec OhVueIcon
+
+```ts
+import * as icons from './icons'
+
+export default defineNuxtConfig({
+  modules: [
+    'vue-dsfr-nuxt-module'
+  ],
+  css: [
+    '@gouvfr/dsfr/dist/core/core.main.min.css',           // Le CSS minimal du DSFR
+    '@gouvfr/dsfr/dist/component/component.main.min.css', // Styles de tous les composants du DSFR
+    '@gouvfr/dsfr/dist/utility/utility.main.min.css',     // Classes utilitaires : les composants de VueDsfr en ont besoin, contient aussi les icônes
+
+    '@gouvfr/dsfr/dist/scheme/scheme.min.css',            // Facultatif : Si les thèmes sont utilisés (thème sombre, thème en bernes)
+  ],
+  runtimeConfig: {
+    public: {
+      vueDsfr: {
+        icons: Object.values(icons),
+      },
+    },
+  },
+})
+```
+
+Et ajouter un fichier `icons.ts` à la racine dans lequel sont réexportées depuis `'oh-vue-icons/icons'` les icônes utilisées :
+
+```ts
+export {
+  RiFlagLine,
+  RiHome2Line,
+} from 'oh-vue-icons/icons'
+```
+
+Et voilà ! Vous êtes prêts à utiliser VueDsfr dans votre app Nuxt ✨
 
 ## Development
 
@@ -81,14 +128,14 @@ npm run release
 ```
 
 <!-- Badges -->
-[npm-version-src]: https://img.shields.io/npm/v/my-module/latest.svg?style=flat&colorA=18181B&colorB=28CF8D
-[npm-version-href]: https://npmjs.com/package/my-module
+[npm-version-src]: https://img.shields.io/npm/v/vue-dsfr-nuxt-module/latest.svg?style=flat&colorA=18181B&colorB=28CF8D
+[npm-version-href]: https://npmjs.com/package/vue-dsfr-nuxt-module
 
-[npm-downloads-src]: https://img.shields.io/npm/dm/my-module.svg?style=flat&colorA=18181B&colorB=28CF8D
-[npm-downloads-href]: https://npmjs.com/package/my-module
+[npm-downloads-src]: https://img.shields.io/npm/dm/vue-dsfr-nuxt-module.svg?style=flat&colorA=18181B&colorB=28CF8D
+[npm-downloads-href]: https://npmjs.com/package/vue-dsfr-nuxt-module
 
-[license-src]: https://img.shields.io/npm/l/my-module.svg?style=flat&colorA=18181B&colorB=28CF8D
-[license-href]: https://npmjs.com/package/my-module
+[license-src]: https://img.shields.io/npm/l/vue-dsfr-nuxt-module.svg?style=flat&colorA=18181B&colorB=28CF8D
+[license-href]: https://npmjs.com/package/vue-dsfr-nuxt-module
 
 [nuxt-src]: https://img.shields.io/badge/Nuxt-18181B?logo=nuxt.js
 [nuxt-href]: https://nuxt.com