devmenezes's avatar

Cant get Vue 3 and TypeScript working.

THE ERROR


ERROR in ./resources/js/app.ts
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: /home/rafael/Projects/quiz/resources/js/app.ts: Unexpected token (8:4)

   6 | const vue_1 = __importDefault(require("vue"));
   7 | const Home_vue_1 = __importDefault(require("@/pages/Home.vue"));
>  8 |     ^  ^  ^

tsconfig.json

{
    "compilerOptions": {
        "allowSyntheticDefaultImports": true,
        "target": "es2016", /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */
        "module": "commonjs", /* Specify what module code is generated. */
        "esModuleInterop": true, /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */
        "forceConsistentCasingInFileNames": true, /* Ensure that casing is correct in imports. */
        /* Type Checking */
        "strict": true, /* Enable all strict type-checking options. */
        /* Completeness */
        "skipLibCheck": true,
        "paths": {
            "@/*": [
                "./js/*"
            ]
        },
        /* Skip type checking all .d.ts files. */
    },
    "include": [
        "resources/js/**/*",
    ],
    "exclude": [
        "node_modules"
    ],
}

webpack.mix.js



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

mix.webpackConfig({
    resolve: {
        extensions: ['.vue', '.ts', '.js'],
        alias: {
            '@': __dirname + '/resources/js',
        }
    },
    module: {
        rules: [
            {
                test: /\.ts$/,
                loader: 'ts-loader',
                exclude: /node_module/,
                options: { appendTsSuffixTo: [/\.vue$/] }
            },
        ],
    },
});

mix.vue()
    .ts('resources/js/app.ts', 'public/js')
    .postCss('resources/css/app.css', 'public/css', [
        require('tailwindcss'),
    ]);


0 likes
1 reply

Please or to participate in this conversation.