I wanted to learn Laravel and Vue.js so I tried installing both by following this tutorial: https://youtu.be/WLQDpY7lOLg?t=1058 Everything worked as ...
提示:本站收集StackOverFlow近2千万问答,支持中英文搜索,鼠标放在语句上弹窗显示对应的参考中文或英文, 本站还提供 中文简体 中文繁体 中英对照 版本,有任何建议请联系yoyou2525@163.com。
I'm new in laravel 9 and vite my old project im using laravel 7 with laravel/UI vue.js 2 for my project now im using laravel 9 and vue.js 2 and vite for my project im developed as my old style in used in laravel 7, but im facing some error IN LARAVEL 9 WITH VITE. ERROR
Cannot set properties of undefined (setting 'id')
MY PROJECT CODE APP.VUE
require('./bootstrap');
import {Vue} from "vue";
import router from "./router";
window.Vue = require('vue');
const app = new Vue({
el: '#app',
router,
});
ROUTER
import Vue from "vue";
import VueRouter from "vue-router";
Vue.use(VueRouter);
// MainComponents
import Home from "./components/MainComponents/Home.vue";
const routes = [
//Admin Login
{
path: "/",
name: "Home",
component: Home,
},
];
const router = new VueRouter({
routes,
mode: "history",
});
export default router;
WELCOME.BLADE.PHP
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>HELLO</title>
@vite('resources/css/app.css')
</head>
<body>
<div id="app">
<router-view></router-view>
</div>
@vite('resources/js/app.js')
</body>
</html>
WEB.PHP
<?php
use Illuminate\Support\Facades\Route;
Route::get('/', function () {
return view('welcome');
});
Route::get('{any}', function () {
return view('welcome');
})->where('any', '.*');
COMPONENT
<template>
<div >
MAIN PAGE COMPONENT
</div>
</template>
vite.config.js
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';
export default defineConfig({
plugins: [
laravel({
input: [
'resources/sass/app.scss',
'resources/js/app.js',
],
refresh: true,
}),
vue({
template: {
transformAssetUrls: {
base: null,
includeAbsolute: false,
},
},
}),
],
resolve: {
alias: {
vue: 'vue/dist/vue.esm-bundler.js',
},
},
});
First things first, it is not really practical to use require
in vite project, but if you do, you have to either use a plugin or manually work around it. Does the id error comes from the vite file itself or from your code?
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.