如何使用 Vite 将入口点更改为默认的 'src/main.js' 以外的其他内容？答案

【问题标题】：How to change the entry point to something other than the default 'src/main.js' using Vite?如何使用 Vite 将入口点更改为默认的 'src/main.js' 以外的其他内容？
【发布时间】：2021-09-13 21:25:33
【问题描述】：

我想指向不同的位置和文件名并偏离 Vite 标准。

假设我的js 文件在out/frontend/../../out.js 中。当我将其重命名为 main.js 并将其复制到我的项目的根目录中时，我得到了它的工作 index.html 和 vite.config.js 存在。但我更愿意以某种方式更改入口点...

我试过了：

rollupInputOptions: {
  // or whatever your entry file is
  input: resolve(__dirname, 'out/frontend/my/path/out.js')
}

没有用。有什么建议吗？

【问题讨论】：

标签： javascript scala.js vite

【解决方案1】：

从 Vite 2 开始，入口文件在 index.html 的 <script> 标签中指定：

<script type="module" src="/src/main.js"></script>

您可以将该文件更改为您想要的文件：

<script type="module" src="/out/frontend/my/path/out.js"></script>

demo

【讨论】：

【解决方案2】：

使用来自path 模块的resolve 并在vite.config.js 配置中添加别名来解析路径，检查。

import { resolve } from 'path'

module.exports = {
  ...
  resolve: {
    alias: {
      '@': resolve(__dirname, '../out/'), // resolve path
    },
  },
  rollupInputOptions: {
    input: resolve(__dirname, '../out/entrypoint.js') // custom main
  }
}

从解析路径导入模块使用'@'，例如：import { myModule } from '@/mymodule'
您必须在index.html 文件中调整新入口点的路径。

【讨论】：