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.