Cette bibliothèque est un plugin pour next.js qui télécharge automatiquement vos actifs statiques sur un CDN spécifié pendant le temps de construction et configure votre application Next.js pour utiliser le préfixe CDN spécifié. Cela facilite la configuration et l'optimisation de vos actifs pour de meilleures performances.
Actuellement, il prend en charge Google Cloud Storage, mais la prise en charge est prévue à d'autres CDN tels que AWS S3, CloudFlare, et plus encore à l'avenir! ?
Installez le package à l'aide de votre gestionnaire de packages préféré:
npm install next-plugin-cdn
ou
yarn add next-plugin-cdn
Définissez les variables d'environnement appropriées pour votre projet.
Dans votre prochain.config.js, importez le plugin et utilisez-le pour configurer votre application:
// Import the plugin and pass cdn info and credentials
// for example using env vars:
const withCDN = require ( "next-plugin-cdn" ) . default ( {
domain : process . env . NODE_ENV === "production" && process . env . CDN_DOMAIN ,
provider : process . env . CDN_PROVIDER ,
bucket : process . env . CDN_BUCKET ,
keyFilename : process . env . CDN_KEY_FILENAME ,
} ) ;
// Then just apply to your nextjs config
/** @type {import('next').NextConfig} */
const nextConfig = withCDN ( {
output : "standalone" ,
reactStrictMode : true ,
swcMinify : true ,
experimental : {
appDir : true ,
} ,
} ) ;
module . exports = nextConfig ;
Maintenant, pendant le processus de construction, le plugin téléchargera vos actifs statiques sur le CDN spécifié et configurera votre application Next.js pour utiliser le préfixe CDN. ?
La fonction withcdn accepte un objet avec les propriétés suivantes:
domain
: le domaine de votre CDN. Cela devrait être défini sur la valeur de la variable d'environnement CDN_Domain.provider
: le fournisseur CDN que vous utilisez (par exemple, Google, AWS, CloudFlare, etc.). Cela devrait être défini sur la valeur de la variable d'environnement CDN_Provider.bucket
: le nom du seau où vos actifs seront téléchargés. Cela devrait être défini sur la valeur de la variable d'environnement CDN_Bucket.keyFilename
: le nom du fichier clé JSON utilisé pour l'authentification avec le fournisseur CDN. Cela devrait être défini sur la valeur de la variable d'environnement CDN_KEY_FILENAME.Ces options sont transmises au plugin, qui s'occupe ensuite de télécharger les actifs et de configurer le préfixe CDN.
Restez à l'écoute pour plus de support du fournisseur CDN! ?
Licence MIT