web-dev-qa-db-fra.com

Comment exécuter Vue.js dev serve avec https?

J'utilise Vue-cli pour créer un projet vue avec un modèle de pack Web. comment l'exécuter avec https en développement en utilisant: npm run dev?

httpswebpackvue.js
8
Raed Alahmad

Le modèle Webpack utilise express en tant que serveur de développement. Alors remplacez simplement 

var server = app.listen(port)

avec le code suivant dans build/dev-server.js. 

var https = require('https');
var fs = require('fs');
var options = {
  key: fs.readFileSync('/* replace me with key file's location */'),
  cert: fs.readFileSync('/* replace me with cert file's location */'))
};
var server = https.createServer(options, app).listen(port);

Veuillez noter que dans le modèle de Webpack, http://localhost:8080 sera automatiquement ouvert dans votre navigateur à l’aide de opn module Vous feriez donc mieux de remplacer var uri = 'http://localhost:' + port par var uri = 'https://localhost:' + port pour plus de commodité. 

6
choasia

Dans la dernière vuejs (du 7 mai 2018), vous devez ajouter un "vue.config.js" dans le répertoire racine du projet: 

vue.config.js:

module.exports = {
  devServer: {
    open: process.platform === 'darwin',
    Host: '0.0.0.0',
    port: 8085, // CHANGE YOUR PORT HERE!
    https: true,
    hotOnly: false,
  },
}

Dans ce fichier, définissez la valeur: https: true

34
Jianwu Chen

Dans /build/webpack.dev.conf.js, à devWepackConfig dans devServer, ajoutez

https: true
8
Blauhirn

Le moyen le plus simple est d'aller dans package.json et de remplacer "dev" par 

 "dev": "webpack-dev-server --inline --progress  --https --config build/webpack.dev.conf.js",

le message fonctionnera toujours sur http: // localhost dans la console mais vous pourrez accéder au site sur https: // localhost

2
Dontreadonme