vite+vue3 配置ip和端口以及自动打开浏览器

爱的叹息2024-12-08 13:11

编辑文件vite.config.ts

修改前vite.config.ts文件内容

javascript 复制代码

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

// https://vite.dev/config/
export default defineConfig({
  plugins: [vue()],
})

修改vite.config.ts后文件内容

新增server内容

javascript 复制代码

server:{
    host: '0.0.0.0',
    port: 8081,
    hmr: true,
    open: true
  }

javascript 复制代码

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

// https://vite.dev/config/
export default defineConfig({
  plugins: [vue()],
  server:{
    host: '0.0.0.0',
    port: 8081,
    hmr: true,
    open: true
  }
})

npm run dev

修改前运行结果5173端口

javascript 复制代码

 VITE v6.0.2  ready in 732 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: use --host to expose
  ➜  press h + enter to show help

修改后运行结果8081端口

javascript 复制代码

 VITE v6.0.2  ready in 582 ms

  ➜  Local:   http://localhost:8081/
  ➜  Network: http://192.168.43.112:8081/
  ➜  press h + enter to show help