Section courante

A propos

Section administrative du site

devServer

Développement serveur
webpack module.exports

Syntaxe

devServer: {option: objet,...}

Paramètres

Paramètre Description
option Ce paramètre permet d'indiquer l'un des options suivantes :
Option Description
after Cette option permet de fournir la possibilité d'exécuter un intergiciel personnalisé après tous les autres intergiciel en interne au sein du serveur.
allowedHosts Cette option permet de mettre sur liste blanche les services autorisés à accéder au serveur de développement.
before Cette option permet d'offrir la possibilité d'exécuter un intergiciel personnalisé avant tout autre intergiciel en interne au sein du serveur.
bonjour Cette option permet de diffuser le serveur via le réseau ZeroConf au démarrage.
clientLogLevel Cette option permet à la console de vos DevTools de montrer des messages, par exemple avant le rechargement, avant une erreur ou lorsque le remplacement du module à chaud est activé. Le devServer.clientLogLevel est peut-être trop détaillé, vous pouvez désactiver la journal de bord en le définissant sur 'silent'.
compress Cette option permet d'activer la compression gzip pour tout ce qui est servi dans votre fichier webpack.config.js ou similaire.
contentBase Cette option permet de dire au serveur d'où diffuser le contenu. Il n'est nécessaire que si vous souhaitez diffuser des fichiers statiques. Le devServer.publicPath sera utilisé pour déterminer d'où les bundles doivent être servis et a la priorité.
contentBasePublicPath Cette option permet d'indiquer au serveur à quelle URL servir le contenu statique devServer.contentBase. S'il y avait un fichier assets/manifest.json, il serait servi à /serve-content-base-at-this-url/manifest.json.
disableHostCheck Cette option permet d'indiquer s'il est définie sur true, de contourner la vérification de l'hôte. Cette situation n'est pas recommandé car les applications ne vérifiant pas l'hôte sont vulnérables aux attaques de reliaison DNS.
filename Cette option permet de réduire les compilations en mode différé. Par défaut en mode différé, chaque requête aboutit à une nouvelle compilation. Avec filename, il est possible de ne compiler que lorsqu'un certain fichier est demandé.
headers Cette option permet d'ajouter des entêtes à toutes les réponses dans votre fichier webpack.config.js ou similaire.
historyApiFallback Cette option permet d'indiquer que la page index.html devra probablement être diffusée à la place des réponses 404 lors de l'utilisation de l'API HTML5 History. Activez devServer.historyApiFallback en le définissant sur true dans votre fichier webpack.config.js ou similaire.
host Cette option permet d'indiquer un hôte à utiliser. Si vous souhaitez que votre serveur soit accessible en externe, spécifié dans votre fichier webpack.config.js ou similaire.
hot Cette option permet d'activer la fonction de remplacement de module à chaud de fichier webpack.config.js ou similaire.
hotOnly Cette option permet d'activer le remplacement de module à chaud (voir devServer.hot) sans actualisation de la page comme solution de secours en cas d'échec de la construction.
http2 Cette option permet de servir sur HTTP/2 en utilisant spdy. Cette option est ignorée par Node 10.0.0 et supérieur, car spdy est arrêter le développement de ces versions. Le serveur de développement migrera vers HTTP/2 intégré à Node une fois qu'Express le prendra en charge.
https Cette option permet d'indiquer le HTTPS. Par défaut, le dev-server sera servi via HTTP. Il peut éventuellement être servi via HTTP/2 avec HTTPS.
index Cette option permet d'indiquer le nom de fichier considéré comme le fichier d'index.
injectClient Cette option permet d'indiquer à devServer d'injecter un client. Si vous définissez devServer.injectClient sur true, vous injectez toujours un client.
injectHot Cette option permet de demander à devServer d'injecter un remplacement de module à chaud. Si vous définissez devServer.injectHot sur true, vous serez toujours injecté.
inline Cette option permet de basculer entre les deux modes différents du serveur de développement. Par défaut, l'application sera servie avec le mode en ligne activé. Cette situation signifie qu'un script sera inséré dans votre bundle pour prendre en charge le rechargement en direct, et les messages de compilation apparaîtront dans la console du navigateur Web.
lazy Cette option permet d'activer le mode lazy, ainsi le serveur de développement ne compilera le bundle que lorsqu'il sera demandé. Cette situation signifie que webpack ne surveillera aucune modification de fichier. Ce mode est appelé lazy.
liveReload Cette option permet au serveur de développement de recharger et réactualiser la page lorsque des modifications de fichier seront détectées. C'est la valeur par défaut. L'option devServer.hot doit être désactivée ou l'option devServer.watchContentBase doit être activée pour que liveReload prenne effet.
mimeTypes Cette option permet au serveur de développement d'enregistrer des types MIME personnalisés. L'objet est passé au webpack-dev-middleware
noInfo Cette option permet d'indiquer au serveur de développement de supprimer les messages tels que les informations sur le bundle webpack. Les erreurs et les avertissements seront toujours affichés.
onListening Cette option permet d'exécuter une fonction personnalisée lorsque webpack-dev-server commence à écouter les connexions sur un port.
open Cette option permet d'indiquer au serveur de développement d'ouvrir le navigateur après le démarrage du serveur. Définissez-le sur true pour ouvrir votre navigateur Web par défaut.
openPage Cette option permet d'indiquer une page vers laquelle naviguer lors de l'ouverture du navigateur Web.
overlay Cette option permet d'afficher une superposition plein écran dans le navigateur Web en cas d'erreurs ou d'avertissements du compilateur.
pfx Cette option permet d'indiquer un chemin vers un fichier SSL .pfx lorsqu'il est utilisé via l'interface de ligne de commande. S'il est utilisé dans les options, il doit être le flux secondaire du fichier .pfx.
pfxPassphrase Cette option permet d'indiquer la phrase secrète d'un fichier SSL PFX.
port Cette option permet d'indiquer un numéro de port pour écouter les demandes sur un fichier webpack.config.js ou similaire.
proxy Cette option permet d'indiquer le proxy de certaines URL peut être utile lorsque vous disposez d'un serveur de développement principal d'API distinct et que vous souhaitez envoyer des demandes d'API sur le même domaine.
progress Cette option permet d'indiquer la sortie de la progression en cours vers la console.
public Cette option permet d'indiquer le lien publique. Lorsque vous utilisez le mode en ligne et que vous faites un proxy dev-server, le script client en ligne ne sait pas toujours où se connecter. Il essaiera de deviner l'URL du serveur en fonction de window.location, mais si cela échoue, vous devrez l'utiliser.
publicPath Cette option permet d'indiquer le chemin des fichiers fournis au navigateur Web. Imaginez que le serveur fonctionne sous http://localhost:8080 et que output.filename est défini sur bundle.js. Par défaut, devServer.publicPath est «/», donc votre bundle est disponible sous le nom http://localhost:8080/bundle.js.
quiet Cette option permet d'activer le mode sans détail, ainsi rien à part les informations de démarrage initial ne sera écrit sur la console. Cette situation signifie également que les erreurs ou les avertissements de webpack ne sont pas visibles.
serveIndex Cette option permet d'indiquer au serveur de développement d'utiliser le intergiciel serveIndex lorsqu'il est activé.
setup Cette option permet d'accéder à l'objet d'application Express et y ajouter votre propre intergiciel personnalisé.
sockHost Cette option permet d'indiquer aux clients connectés à devServer d'utiliser l'hôte de socket fourni.
sockPath Cette option permet d'indiquer le chemin d'accès auquel se connecter au socket de rechargement.
sockPort Cette option permet d'indiquer aux clients connectés à devServer d'utiliser le port socket fourni.
staticOptions Cette option permet d'indiquer les options statique. Il est possible de configurer des options avancées pour servir des fichiers statiques à partir de contentBase.
stats Cette option permet de contrôler précisément les informations sur le bundle affichées. Il peut être un bon compromis si vous voulez des informations groupées, mais pas toutes.
stdin Cette option permet de fermer le serveur à la fin de stdin.
transportMode Cette option permet soit de choisir le mode de transport devServer actuel pour le client/serveur individuellement soit de fournir une mise en oeuvre client/serveur personnalisée. Il permet de spécifier la manière dont le navigateur Web ou un autre client communique avec le devServer.
transportMode.client Cette option permet de créer une mise en oeuvre client personnalisée, créant une classe étendant BaseClient.
useLocalIp Cette option permet au navigateur Web de s'ouvrir avec votre adresse IP locale.
watchContentBase Cette option permet d'indiquer à dev-server de surveiller les fichiers servis par l'option devServer.contentBase. Il est désactivé par défaut. Lorsqu'elles sont activées, les modifications de fichiers déclenchent un rechargement de la page complète.
watchOptions Cette option permet de contrôler les options liées à la visualisation des fichiers.
writeToDisk Cette option permet d'indiquer à devServer d'écrire les ressources générées sur le disque. La sortie est écrite dans le répertoire output.path.

Description

Ce champ permet de développer rapidement une application à l'aide de webpack-dev-server.



Dernière mise à jour : Vendredi, le 7 Mai 2021