Level 4
for future readers
"@types/webpack-env": "^1.15.3",
was "missing" (nowhere mentioned you need it)
Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.
Hi, I'm trying to setup laravel 8, vue 3, inertia, bootstrap 5. I was getting all sort of errors I figured somehow mainly by starting over but this one I have no idea
Error appears when running npm run dev
package.json
{
"private": true,
"scripts": {
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --disable-host-check --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
},
"devDependencies": {
"@inertiajs/inertia": "^0.5.0",
"@inertiajs/inertia-vue": "^0.4.0",
"@inertiajs/inertia-vue3": "^0.2.0",
"@inertiajs/progress": "^0.1.2",
"@vue/compiler-sfc": "^3.0.2",
"axios": "^0.21.0",
"bootstrap": "^5.0.0-alpha2",
"cross-env": "^7.0.2",
"laravel-mix": "^5.0.7",
"laravel-mix-vue3": "^0.7.0",
"lodash": "^4.17.20",
"popper.js": "^1.16.1",
"resolve-url-loader": "^3.1.2",
"sass": "^1.27.0",
"sass-loader": "^10.0.4",
"vue": "^3.0.2",
"vue-template-compiler": "^2.6.12"
}
}
webpack.mix.js
const mix = require('laravel-mix');
require('laravel-mix-vue3');
mix.vue3('resources/js/app.js', 'public/js', {
typescript: false,
}).sass('resources/sass/app.scss', 'public/css');
app.js
import './bootstrap';
import { createApp, h } from 'vue';
import { app, plugin } from '@inertiajs/inertia-vue3';
import { InertiaProgress } from '@inertiajs/progress';
const el = document.getElementById('app');
el.classList.add("h-full");
InertiaProgress.init({
delay: 250,
color: '#29d',
includeCSS: true,
showSpinner: false,
});
createApp({
render: () => h(app , {
initialPage: JSON.parse(el.dataset.page),
resolveComponent: name => require(`./Pages/${name}`).default
}),
}).use(plugin).mount(el);
error won't appear until running vue init
createApp({
render: () => h(app , {
initialPage: JSON.parse(el.dataset.page),
resolveComponent: name => require(`./Pages/${name}`).default
}),
}).use(plugin).mount(el);
for future readers
"@types/webpack-env": "^1.15.3",
was "missing" (nowhere mentioned you need it)
Please or to participate in this conversation.