php 在./resources/js/components/ExampleComponent中出现错误,安装Laravel vue auth命令中的vue 1:0

k3fezbri  于 5个月前  发布在  PHP
关注(0)|答案(1)|浏览(80)

在Laravel应用程序中工作,我的节点版本是16,使用Laravel 9并安装php artisan ui vue --auth。我的web.pack.js是这样的

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

字符串
package.json是

{
    "private": true,
    "scripts": {
        "dev": "npm run development",
        "development": "mix",
        "watch": "mix watch",
        "watch-poll": "mix watch -- --watch-options-poll=1000",
        "hot": "mix watch --hot",
        "prod": "npm run production",
        "production": "mix --production"
    },
    "devDependencies": {
        "@popperjs/core": "^2.11.6",
        "@vitejs/plugin-vue": "^4.5.0",
        "axios": "^1.6.3",
        "bootstrap": "^5.2.3",
        "laravel-mix": "^6.0.49",
        "lodash": "^4.17.19",
        "postcss": "^8.1.14",
        "sass": "^1.56.1",
        "vue": "^3.2.37",
        "vue-loader": "^16.2.0"
    }
}


但是当我尝试运行npm run dev时,它正在删除以下错误消息和laravel mix错误

ERROR in ./resources/js/components/ExampleComponent.vue 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <template>
|     <div class="container">
|         <div class="row justify-content-center">

webpack compiled with 1 error


我该如何解决这个问题

qcbq4gxm

qcbq4gxm1#

webpack.mix.js中使用下面的行

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

字符串
然后修改你的代码。

mix.js('resources/js/app.js', 'public/js')
    .postCss('resources/css/app.css', 'public/css', [
        //
    ])
    .vue({
        version: 3
    })
    .webpackConfig({
        module: {
            rules: [{
                test: /\.vue$/,
                loader: "vue-loader",
            }, ],
        },
    });
;

相关问题