时间戳

首页 > 解决方案 > 切换到 Typescript 后找不到 App.js

javascript - 切换到 Typescript 后找不到 App.js

问题描述

我有一个问题，我有点绝望，因为我还没有找到解决方案（也因为我不知道用谷歌搜索什么）。
所以我有一个现有的（仍然几乎是新的）Laravel 项目，并想使用 typescript 从 vue2 升级到 vue3。因此，在本教程中，我从 vue2 切换到了 vue3，在本教程中，我切换到了 typescript。在为项目提供服务时（php artisan serve），我收到http://127.0.0.1:8000/js/app.ts的“404 Not Found”错误。还有两个警告，源“http://127.0.0.1:8000/js/app.ts”和“http://localhost:35729/livereload.js”无法加载

这是我更改的一些文件

// webpack.mix.js
const LiveReloadPlugin = require('webpack-livereload-plugin');

mix.ts('resources/js/app.ts', 'public/js')
    .vue();

mix.webpackConfig({
    plugins: [new LiveReloadPlugin()]
})

// tsconfig.json
{
    "compilerOptions": {
        "target": "es5",
        "strict": true,
        "module": "es2015",
        "moduleResolution": "node",
    },
    "include": [
        "resources/js/**/*"
    ]
}

// resources/js/app.ts
import { createApp } from 'vue';
import App from './components/App.vue'

createApp(App)
    .mount('#app');

// resources/shims-vue.d.ts
declare module "*.vue" {
    import { ComponentOptions } from "vue";
    const component: ComponentOptions;
    export default component;
}

有谁知道如何解决这个问题？我真的很感激任何建议。

标签： javascriptlaraveltypescriptvue.js

解决方案

当我将 app.js 重命名为 app.ts 时，所有出现的地方也都重命名了。所以在我的 start.blade.php 中引用了 app.ts 的脚本，编译后它显然不存在......我不得不将其更改为 app.js，现在它可以工作了。

推荐阅读