Laravel Vuejs 和 Typescript -> npm run watch 抛出异常

问题描述

简而言之我的设置： 拉拉维尔 8 打字稿 Vuejs

tsconfig.js

{
    "compilerOptions": {
        "module": "commonjs","target": "es5","noImplicitAny": false,"sourceMap": false
    },"include": [
        "resources/js/**/*",]
}

webpack.mix.js

const mix = require('laravel-mix');

mix.js('resources/js/app.js','public/js')
    .js('resources/js/pages/user/configuration/configuration.js','public/js/pages/user/configuration')
    .postCss('resources/css/app.css','public/css')
    .postCss('node_modules/animate.css/animate.min.css','public/css')
    .sass('resources/sass/toolBox.scss','public/css')
    .vue()
    .webpackConfig({
        module: {
            rules: [
                {
                    test: /\.tsx?$/,loader: 'ts-loader',options: { appendTsSuffixTo: [/\.vue$/] },exclude: /node_modules/,}
            ]
        },resolve: {
            extensions: ["*",".js",".jsx",".vue",".ts",".tsx"]
        }
    });

ConfigurationPage.vue

<template>
    <div class="col col-12 col-xl-6 d-flex tb-m-b-25">
        {{ greeting }}
    </div>
</template>

<script lang="ts">

import { ref } from 'vue'

export default {
    setup() {
        const greeting= ref('hello');

        return {
            greeting
        }
    }
}
</script>

<style></style>

我的 package.json 中的 DevDependencies：

  "devDependencies": {
    "@vue/compiler-sfc": "^3.0.11","axios": "^0.21.1","cross-env": "^7.0","laravel-mix": "^6.0","lodash": "^4.17.21","postcss": "^8.3.0","resolve-url-loader": "^3.1.0","sass": "^1.29.0","sass-loader": "^8.0.2","ts-loader": "^9.2.2","typescript": "^4.3.2","vue-loader": "^16.2.0","vue-template-compiler": "^2.6.13"
  },

文件/文件夹结构

resources
 | js
 | | pages
 | | | user
 | | | | configuration
 | | | | | - configuration.js
 | | | | | - ConfigurationPage.vue
 | - app.js
 | - init.ts

init.ts 是空的。如果我的资源文件夹中没有至少一个 .ts 文件，ts-loader 会抛出异常，说它找不到要编译的东西。我正在阅读，使用空的打字稿文件很常见。

问题

每次我在 ConfigurationPage.vue 中进行更改时，我都会在 npm run watch-poll 中得到这个执行：

✖ Mix
  Compiled with some errors in 510.02ms
ERROR in /var/www/resources/js/init.ts
2:7-13
[tsl] ERROR in /var/www/resources/js/init.ts(2,8)
      TS2339: Property '__file' does not exist on type '{}'.
webpack compiled with 1 error

我不明白，init.ts 是空的。这对我来说毫无意义。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）