如何设置vite.config.js基本公共路径？

Question

我正在尝试为我的开发和生产环境设置一个基本 urlvitejs ，但配置未解析。

根据vitejs，您可以在配置选项中设置在开发或生产中提供服务时的基本公共路径。

当从命令行运行 vite 时，Vite 会自动尝试解析项目根目录中名为 vite.config.js 的配置文件。

问题是我的应用程序请求没有通过'http://localhost:8080/'，但仍然附加到默认服务端口http://localhost:3000/。

我当前的配置如下：

// vite.config.js
export default {
  base: 'http://localhost:8080/'
}

// packages.json
{
  "name": "vue3ui",
  "version": "0.0.0",
  "scripts": {
    "dev": "vite",
    "build": "vite build"
  },
  "dependencies": {
    ...,
    "vue": "^3.0.11"
  },
  "devDependencies": {
    "@vue/compiler-sfc": "^3.0.11",
    "vite": "^1.0.0-rc.13"
  }
}

Answer 1

我不太清楚，但我会尽力给你一个答案以实现你想要的。

我正在尝试为我的开发和生产环境设置一个基本 url

编辑：我再次阅读了你的问题，我认为你正在寻找这个答案的C点。

应该做出改变vite.config.js

A)您希望将运行端口从 更改为3000，8080调整server.port

server: {
  port: '8080'
}

B）但是如果您希望继续运行localhost:3000并将请求转发到，localhost:8080那么您必须进行调整server.proxy

server: {
    proxy: {
      '/': {
        target: 'http://localhost:8080/'
      },

      '/admin': {
        target: 'http://localhost:8081/'
      }
    }
  }

例子：

• '/'：将所有请求代理到localhost:8080
• '/admin'：将仅代理具有端点的/admin请求http://localhost:8081

C)根据开发或生产环境更改基本路径

.env文件 ：

// .env
 
// Running locally
APP_ENV=local
// you change port of local/dev here to :8000
// do not forget to adjust `server.port`
ASSET_URL=http://localhost:3000
 
// Running production build
APP_ENV=production
ASSET_URL=https://your-prod-asset-domain.com

vite.config.js：

const ASSET_URL = process.env.ASSET_URL || '';

export default { 
  base: `${ASSET_URL}/dist/`,

  [...]
}

如果这不是您想要的，请更准确，我将编辑我的答案。

有关更多信息，请前往官方文档https://vitejs.dev/config/#server-options