Skip to content

Commit b7f72f9

Browse files
StanleyMasindeStanleyMasinde
committed
migrate to Nuxt 4
1 parent 544b1e4 commit b7f72f9

File tree

12 files changed

+9363
-17928
lines changed

12 files changed

+9363
-17928
lines changed

‎.eslintrc.js‎

Lines changed: 0 additions & 23 deletions
This file was deleted.

‎.github/workflows/nuxtjs.yml‎

Lines changed: 17 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -34,23 +34,35 @@ jobs:
3434
- name: Detect package manager
3535
id: detect-package-manager
3636
run: |
37-
if [ -f "${{ github.workspace }}/yarn.lock" ]; then
37+
if [ -f "${{ github.workspace }}/pnpm-lock.yaml" ]; then
38+
echo "manager=pnpm" >> $GITHUB_OUTPUT
39+
echo "command=install --frozen-lockfile" >> $GITHUB_OUTPUT
40+
echo "runner=pnpm" >> $GITHUB_OUTPUT
41+
exit 0
42+
elif [ -f "${{ github.workspace }}/yarn.lock" ]; then
3843
echo "manager=yarn" >> $GITHUB_OUTPUT
3944
echo "command=install" >> $GITHUB_OUTPUT
45+
echo "runner=yarn" >> $GITHUB_OUTPUT
4046
exit 0
4147
elif [ -f "${{ github.workspace }}/package.json" ]; then
4248
echo "manager=npm" >> $GITHUB_OUTPUT
4349
echo "command=ci" >> $GITHUB_OUTPUT
50+
echo "runner=npm" >> $GITHUB_OUTPUT
4451
exit 0
4552
else
4653
echo "Unable to determine package manager"
4754
exit 1
4855
fi
56+
- name: Setup pnpm
57+
if: steps.detect-package-manager.outputs.manager == 'pnpm'
58+
uses: pnpm/action-setup@v4
59+
with:
60+
version: 10
4961
- name: Setup Node
5062
uses: actions/setup-node@v4
5163
with:
5264
node-version: "20"
53-
cache: ${{ steps.detect-package-manager.outputs.manager }}
65+
cache: ${{ steps.detect-package-manager.outputs.runner }}
5466
- name: Setup Pages
5567
uses: actions/configure-pages@v5
5668
with:
@@ -63,9 +75,9 @@ jobs:
6375
uses: actions/cache@v4
6476
with:
6577
path: |
66-
dist
78+
.output/public
6779
.nuxt
68-
key: ${{ runner.os }}-nuxt-build-${{ hashFiles('dist') }}
80+
key: ${{ runner.os }}-nuxt-build-${{ hashFiles('pnpm-lock.yaml') }}
6981
restore-keys: |
7082
${{ runner.os }}-nuxt-build-
7183
- name: Install dependencies
@@ -75,7 +87,7 @@ jobs:
7587
- name: Upload artifact
7688
uses: actions/upload-pages-artifact@v3
7789
with:
78-
path: ./dist
90+
path: ./.output/public
7991

8092
# Deployment job
8193
deploy:

‎.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,7 @@ typings/
6767

6868
# nuxt.js build output
6969
.nuxt
70+
.output
7071

7172
# Nuxt generate
7273
dist

‎components/Modal.vue‎

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,11 @@
11
<template>
2-
<b-modal v-model="show" hide-header hide-footer centered>
2+
<BModal
3+
:model-value="show"
4+
hide-header
5+
hide-footer
6+
centered
7+
@update:model-value="$emit('update:show', $event)"
8+
>
39
<a
410
target="_blank"
511
href="https://opensource254.github.io/guidelines/"
@@ -12,10 +18,11 @@
1218
class="btn btn-primary btn-block text-white"
1319
>On Slack</a
1420
>
15-
</b-modal>
21+
</BModal>
1622
</template>
1723
<script>
1824
export default {
25+
emits: ['update:show'],
1926
props: {
2027
show: {
2128
type: Boolean,

‎eslint.config.mjs‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
// @ts-check
2+
import withNuxt from './.nuxt/eslint.config.mjs'
3+
4+
export default withNuxt(
5+
// Your custom configs here
6+
)

‎layouts/default.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,8 +24,8 @@
2424
</nav>
2525
</div>
2626
<!-- End: Navigation with Button -->
27-
<nuxt />
28-
<JoinModal :show="showJoin" />
27+
<slot />
28+
<JoinModal :show="showJoin" @update:show="showJoin = $event" />
2929
<footer>
3030
<div class="row">
3131
<div class="col-sm-6 col-md-4 footer-navigation">

‎nuxt.config.js‎

Lines changed: 44 additions & 90 deletions
Original file line numberDiff line numberDiff line change
@@ -1,95 +1,49 @@
1-
export default {
2-
mode: 'universal',
3-
server: {
1+
export default defineNuxtConfig({
2+
compatibilityDate: '2026-03-21',
3+
devServer: {
44
port: 3002,
5-
host: 'localhost',
6-
timing: false
5+
host: 'localhost'
76
},
8-
/*
9-
** Headers of the page
10-
*/
11-
head: {
12-
title: process.env.npm_package_name || '',
13-
meta: [
14-
{ charset: 'utf-8' },
15-
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
16-
{
17-
hid: 'description',
18-
name: 'description',
19-
content: process.env.npm_package_description || ''
20-
}
21-
],
22-
link: [
23-
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' },
24-
{
25-
rel: 'stylesheet',
26-
href: 'https://cdnjs.cloudflare.com/ajax/libs/aos/2.1.1/aos.css'
27-
},
28-
{
29-
rel: 'stylesheet',
30-
href:
31-
'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'
32-
},
33-
{
34-
rel: 'stylesheet',
35-
href: 'https://fonts.googleapis.com/css?family=Cookie'
36-
},
37-
{
38-
rel: 'stylesheet',
39-
href: 'https://fonts.googleapis.com/css2?family=Lobster&display=swap'
40-
},
41-
{
42-
rel: 'stylesheet',
43-
href:
44-
'https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css'
45-
}
46-
]
7+
app: {
8+
head: {
9+
title: process.env.npm_package_name || '',
10+
meta: [
11+
{ charset: 'utf-8' },
12+
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
13+
{
14+
name: 'description',
15+
content: process.env.npm_package_description || ''
16+
}
17+
],
18+
link: [
19+
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' },
20+
{
21+
rel: 'stylesheet',
22+
href:
23+
'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'
24+
},
25+
{
26+
rel: 'stylesheet',
27+
href: 'https://fonts.googleapis.com/css?family=Cookie'
28+
},
29+
{
30+
rel: 'stylesheet',
31+
href: 'https://fonts.googleapis.com/css2?family=Lobster&display=swap'
32+
},
33+
{
34+
rel: 'stylesheet',
35+
href:
36+
'https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css'
37+
}
38+
]
39+
}
4740
},
48-
/*
49-
** Customize the progress-bar color
50-
*/
51-
loading: { color: '#fff' },
52-
/*
53-
** Global CSS
54-
*/
55-
css: ['@/assets/css/app.css'],
56-
/*
57-
** Plugins to load before mounting the App
58-
*/
41+
css: ['bootstrap/dist/css/bootstrap.min.css', '@/assets/css/app.css'],
5942
plugins: [],
60-
/*
61-
** Nuxt.js dev-modules
62-
*/
63-
buildModules: [
64-
// Doc: https://github.com/nuxt-community/eslint-module
65-
'@nuxtjs/eslint-module',
66-
// Doc: https://github.com/nuxt-community/stylelint-module
67-
'@nuxtjs/stylelint-module'
68-
],
69-
/*
70-
** Nuxt.js modules
71-
*/
72-
modules: [
73-
// Doc: https://bootstrap-vue.js.org
74-
'bootstrap-vue/nuxt',
75-
// Doc: https://axios.nuxtjs.org/usage
76-
'@nuxtjs/axios',
77-
'@nuxtjs/pwa',
78-
// Doc: https://github.com/nuxt-community/dotenv-module
79-
'@nuxtjs/dotenv'
80-
],
81-
/*
82-
** Axios module configuration
83-
** See https://axios.nuxtjs.org/options
84-
*/
85-
axios: {},
86-
/*
87-
** Build configuration
88-
*/
89-
build: {
90-
/*
91-
** You can extend webpack config here
92-
*/
93-
extend(config, ctx) {}
43+
modules: ['@bootstrap-vue-next/nuxt', '@nuxt/eslint'],
44+
vite: {
45+
optimizeDeps: {
46+
include: ['bootstrap-vue-next', 'bootstrap-vue-next/components/BModal']
47+
}
9448
}
95-
}
49+
})

0 commit comments

Comments
 (0)