使用 vite 的 laravel 插件配置前端资源的时候配置入口脚本无效

1. 运行环境

laravel: 10
php: 8.3
node: 18
tsc: 5.4
系统:laravel sail (debian)

开发环境

2. 问题描述

今天使用 vite 的 laravel 插件配置前端资源的时候一直失败,vite 配置如下:

// vite.config.ts
import { defineConfig } from 'vite'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import vue from '@vitejs/plugin-vue'
import laravel from 'laravel-vite-plugin';

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    laravel({
      input: ['resources/ts/app.ts'],
      refresh: true
    }),
    vue({
      template: {
        transformAssetUrls: {
          base: null,
          includeAbsolute: false,
        }
      },
    }),
    AutoImport({
      resolvers: [ElementPlusResolver()],
    }),
    Components({
      resolvers: [ElementPlusResolver()],
    }),
  ],
  resolve: {
    alias: {
      '@': 'resources/ts',
    },
  },
})

tsconfig.json 文件的内容如下:

{
  "compilerOptions": {
    "target": "ES2020",
    "useDefineForClassFields": true,
    "module": "ESNext",
    "lib": ["ES2020", "DOM", "DOM.Iterable"],
    "skipLibCheck": true,

    /* Bundler mode */
    "moduleResolution": "bundler",
    "allowImportingTsExtensions": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "preserve",

    /* Linting */
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noFallthroughCasesInSwitch": true
  },
  "include": ["resources/**/*.ts", "resources/**/*.tsx", "resources/**/*.vue"],
  "references": [{ "path": "./tsconfig.node.json" }]
}

并且存在 resources/ts/app.ts 这个文件,其他配置都是默认配置,但当我在启动用 vite 服务后(sail yarn dev)访问 http://localhost:5714/resources/ts/app.ts 的时候一直返回状态 404 和一个默认由 laravel-vite-plugin 这个包提供的页面内容。

使用 vite 的 laravel 插件配置前端资源的时候配置入口脚本无效

3. 期望得到的结果

期望能正常加载 resources/ts/app.ts 编译后的内容。我一开始怀疑是否是typescript 安装的错误导致,但从新装了之后问题依旧存在,请大家帮忙看看是哪里配置的问题?

《L04 微信小程序从零到发布》
从小程序个人账户申请开始,带你一步步进行开发一个微信小程序,直到提交微信控制台上线发布。
《L03 构架 API 服务器》
你将学到如 RESTFul 设计风格、PostMan 的使用、OAuth 流程,JWT 概念及使用 和 API 开发相关的进阶知识。
讨论数量: 0
(= ̄ω ̄=)··· 暂无内容!

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!