How to Run Vue.js Dev Serve with HTTPS?

To run a Vue.js project created with Vue CLI using HTTPS in development, you can follow these steps:

1. Navigate to the root directory of your Vue project.

2. If you don’t already have a `vue.config.js` file, create one in the root of your project. In this file, you can configure the development server to use HTTPS.

module.exports = {
    devServer: {
      https: true,
      host: 'localhost', // Optional
      port: 8080, // Optional
    },
  };

3. Now, you can run your development server with HTTPS

4. Open your browser and navigate to `https://localhost:8080` (or the specified port). You may need to accept a security warning since you’re using a self-signed certificate.

5. If you want to customize the SSL certificate (e.g., for production-like environments), you can specify `key` and `cert` paths in the `devServer` configuration:

const fs = require('fs');
   const path = require('path');
   module.exports = {
     devServer: {
       https: {
         key: fs.readFileSync(path.resolve(__dirname, 'path/to/your/server.key')),
         cert: fs.readFileSync(path.resolve(__dirname, 'path/to/your/server.crt')),
       },
     },
   };

Make sure to replace the paths with the actual locations of your SSL certificate and key if you’re using your own.