diff --git a/Dockerfile b/Dockerfile index a7293f580b..d21b469aaa 100644 --- a/Dockerfile +++ b/Dockerfile @@ -76,7 +76,7 @@ COPY pnpm-lock.yaml . COPY .npmrc . # copy the nuxt configuration file -COPY --from=builder /usr/app/nuxt.config.js . +COPY --from=builder /usr/app/nuxt.config.ts . # copy distribution directory with the static content COPY --from=builder /usr/app/.nuxt /usr/app/.nuxt @@ -106,4 +106,3 @@ EXPOSE 8443 # run the application in static mode ENTRYPOINT ["pnpm", "run", "start"] - diff --git a/nuxt-template-overrides/README.md b/nuxt-template-overrides/README.md index c6118be9e3..99ed3da0c2 100644 --- a/nuxt-template-overrides/README.md +++ b/nuxt-template-overrides/README.md @@ -1,6 +1,6 @@ # Nuxt vue-app template overrides -Due to a CSS ordering bug that we haven't been able to find any other solutions for, we've had to override the Nuxt templates for the `App.js` and `index.js` files to prevent any Vue components from being imported before the static CSS assets in the `nuxt.config.js`. +Due to a CSS ordering bug that we haven't been able to find any other solutions for, we've had to override the Nuxt templates for the `App.js` and `index.js` files to prevent any Vue components from being imported before the static CSS assets in the `nuxt.config.ts`. ## Described changes diff --git a/nuxt.config.js b/nuxt.config.ts similarity index 94% rename from nuxt.config.js rename to nuxt.config.ts index db63925083..c365bef794 100644 --- a/nuxt.config.js +++ b/nuxt.config.ts @@ -1,9 +1,13 @@ +import type { NuxtConfig } from '@nuxt/types' + import pkg from './package.json' import locales from './src/locales/scripts/valid-locales.json' + import { VIEWPORTS } from './src/constants/screens' + import { isNotProd } from './src/utils/dev' +import { sentryConfig } from './src/utils/sentry-config' import { env } from './src/utils/env' -import { sentry } from './src/utils/sentry-config' /** * The default metadata for the site. Can be extended and/or overwritten per page. And even in components! @@ -51,6 +55,7 @@ const meta = [ if (process.env.NODE_ENV === 'production') { meta.push({ + // @ts-expect-error: 'http-equiv' isn't allowed here by Nuxt 'http-equiv': 'Content-Security-Policy', content: 'upgrade-insecure-requests', }) @@ -99,7 +104,7 @@ const head = { ], } -export default { +const config: NuxtConfig = { // eslint-disable-next-line no-undef version: pkg.version, // used to purge cache :) cache: { @@ -116,9 +121,9 @@ export default { router: { middleware: 'middleware', }, - components: { - dirs: [{ path: '~/components', extensions: ['vue'], pathPrefix: false }], - }, + components: [ + { path: '~/components', extensions: ['vue'], pathPrefix: false }, + ], plugins: [ { src: '~/plugins/url-change.js' }, { src: '~/plugins/migration-notice.js' }, @@ -195,7 +200,7 @@ export default { * {@link https://github.com/nuxt-community/redirect-module#usage} */ redirect: [{ from: '^/photos/(.*)$', to: '/image/$1', statusCode: 301 }], - sentry, + sentry: sentryConfig, build: { templates: [ { @@ -245,3 +250,5 @@ export default { }, }, } + +export default config diff --git a/src/store/usage-data.js b/src/store/usage-data.js index a1ba17049d..702c4541ba 100644 --- a/src/store/usage-data.js +++ b/src/store/usage-data.js @@ -6,7 +6,7 @@ import { } from '~/constants/usage-data-analytics-types' import stringToBoolean from '~/utils/string-to-boolean' import UsageDataService from '~/data/usage-data-service' -import { sentry as sentryConfig } from '~/utils/sentry-config' +import { sentryConfig } from '~/utils/sentry-config' const disabled = !stringToBoolean(process.env.enableInternalAnalytics) diff --git a/src/utils/env.js b/src/utils/env.ts similarity index 62% rename from src/utils/env.js rename to src/utils/env.ts index 304ac81110..0bd911dbd4 100644 --- a/src/utils/env.js +++ b/src/utils/env.ts @@ -1,15 +1,10 @@ -// Use relative import to resolve during nuxt runtime -import stringToBoolean from './string-to-boolean' - /** * Default environment variables are set on this key. Defaults are fallbacks to existing env vars. * All boolean values should be designed to be false by default. */ -export const env = { +export const env: Record = { apiUrl: process.env.API_URL ?? 'https://api.openverse.engineering/v1/', filterStorageKey: 'openverse-filter-visibility', notificationStorageKey: 'openverse-show-notification', - enableInternalAnalytics: stringToBoolean( - process.env.ENABLE_INTERNAL_ANALYTICS - ), + enableInternalAnalytics: process.env.ENABLE_INTERNAL_ANALYTICS ?? 'false', } diff --git a/src/utils/sentry-config.js b/src/utils/sentry-config.js deleted file mode 100644 index e41a32caf9..0000000000 --- a/src/utils/sentry-config.js +++ /dev/null @@ -1,10 +0,0 @@ -import { isDev } from '~/utils/dev' - -export const sentry = { - dsn: - process.env.SENTRY_DSN || - 'https://53da8fbcebeb48a6bf614a212629df6b@o787041.ingest.sentry.io/5799642', - disabled: isDev, - environment: process.env.NODE_ENV, - lazy: true, -} diff --git a/src/utils/sentry-config.ts b/src/utils/sentry-config.ts new file mode 100644 index 0000000000..f6a7c19953 --- /dev/null +++ b/src/utils/sentry-config.ts @@ -0,0 +1,16 @@ +import type { ModuleConfiguration } from '@nuxtjs/sentry' + +import { isNotProd } from './dev' + +/** + * Get the Sentry configuration based on the current environment. + * @param isDisabled - whether to disable Sentry + * @returns the Sentry configuration to use + */ +export const sentryConfig: ModuleConfiguration = { + dsn: + process.env.SENTRY_DSN || + 'https://53da8fbcebeb48a6bf614a212629df6b@o787041.ingest.sentry.io/5799642', + disabled: isNotProd, + lazy: true, +}