Sounds like it cannot read the vite.config.js. Can you show its content?
Failed to load config from vite.config.js
I have a fresh Laravel installation with Jetstream/Interia but when I run 'npm install && npm run dev' I get the error 'failed to load config from vite.config.js' - it obviously cannot compile as the Vite manifest file cannot be found, but I have no idea how to resolve this. Any help would be greatly appreciated!
It's the standard config file laravel creates as follows:
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';
export default defineConfig({
plugins: [
laravel({
input: 'resources/js/app.js',
refresh: true,
}),
vue({
template: {
transformAssetUrls: {
base: null,
includeAbsolute: false,
},
},
}),
],
});
@builtbykimster That looks completely fine. What happens if you run npm run build
That's when I get the error... failed to load config from vite.config.js
@builtbykimster Ok so same error for npm run dev and npm run build? Can you try npm update and then try again?
@Sinnbeck this worked for me...thanks
@Sinnbeck Thank you for your help.
@Sinnbeck Same error I'm afraid...
@builtbykimster Strange. And there is not more to the error than that 1 line?
Can you show your package.json file?
@Sinnbeck Here is the full error
> vite build
failed to load config from /Users/Sites/hub/vite.config.js
error during build:
Error: Cannot find module 'node:path'
Require stack:
- /Users/Sites/hub/node_modules/vite/dist/node-cjs/publicUtils.cjs
- /Users/Sites/hub/node_modules/vite/index.cjs
- /Users/Sites/hub/vite.config.js
- /Users/Sites/hub/node_modules/vite/dist/node/chunks/dep-c6273c7a.js
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:889:15)
at Function.Module._load (internal/modules/cjs/loader.js:745:27)
at Module.require (internal/modules/cjs/loader.js:961:19)
at require (internal/modules/cjs/helpers.js:92:18)
at Object.<anonymous> (/Users/Sites/hub/node_modules/vite/dist/node-cjs/publicUtils.cjs:5:14)
at Module._compile (internal/modules/cjs/loader.js:1072:14)
at Module._extensions..js (internal/modules/cjs/loader.js:1101:10)
at Object._require.extensions.<computed> [as .js] (file:///Users/Sites/hub/node_modules/vite/dist/node/chunks/dep-c6273c7a.js:62892:17)
at Module.load (internal/modules/cjs/loader.js:937:32)
at Function.Module._load (internal/modules/cjs/loader.js:778:12)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ build: `vite build`
npm ERR! Exit status 1
and here is the package.json
{
"private": true,
"scripts": {
"dev": "vite",
"build": "vite build"
},
"devDependencies": {
"@inertiajs/inertia": "^0.11.0",
"@inertiajs/inertia-vue3": "^0.6.0",
"@inertiajs/progress": "^0.2.7",
"@tailwindcss/forms": "^0.5.2",
"@tailwindcss/typography": "^0.5.2",
"@vitejs/plugin-vue": "^3.0.0",
"autoprefixer": "^10.4.7",
"axios": "^0.27",
"laravel-vite-plugin": "^0.5.0",
"lodash": "^4.17.19",
"postcss": "^8.4.14",
"tailwindcss": "^3.1.0",
"vite": "^3.0.0",
"vue": "^3.2.31"
}
}
@builtbykimster Ah! It might be due to an old version of node. What does node -v give you?
@Sinnbeck v14.17.4 - update required?
@builtbykimster I would give it a shot at least :) I am running version 16.16. Try upgrading to 16 as well
@Sinnbeck This fixed it for me, thank you.
@Sinnbeck The version of my node -v is v18.7.0. When i run the npm run dev command i still have that error.Please i need help.
@Sinnbeck I was running on node 18.11.0 and had the same error message as @builtbykimster. Switching to node 16.11.1 resolved the issue for me.
@Sinnbeck thank you
@Sinnbeck Thank you so much :-)
And as if by magic... thanks for your help! Should have tried that earlier ;)
@builtbykimster Happy to help :) Please mark a best answer so others can see the solution if they have the same problem
@Sinnbeck your comment helped me as well. Thank you very much.❤️
@BharathASL happy to help :)
@Sinnbeck helped me too. thank you! (' ',)
Hi, I am having same trouble and could not move forward even after spending hours in this blocker. Any help would be greatly appreciated.
My environment:
npm -v => 8.19.2
node -v => 18.7.0
yarn -v => 1.22.19
vite.config.ts
import { defineConfig } from 'laravel-vite'
import vue from '@vitejs/plugin-vue'
export default defineConfig({
server: {
watch: {
ignored: ['**/.env/**'],
},
},
resolve: {
alias: {
"vue-i18n": "vue-i18n/dist/vue-i18n.cjs.js"
}
}
}).withPlugins(
vue
)
composer.json
{
"name": "sbtech-probelian/probelian",
"description": "Intelligent Procurement Platform. http://www.probelian.com",
"keywords": [
"framework",
"laravel"
],
"license": "MIT",
"type": "project",
"require": {
"php": "^7.4 || ^8.0",
"aws/aws-sdk-php": "^3.142",
"barryvdh/laravel-dompdf": "^0.9.0",
"doctrine/dbal": "^2.10",
"dragonmantank/cron-expression": "^3.1",
"fideloper/proxy": "^4.0",
"fruitcake/laravel-cors": "^1.0",
"guzzlehttp/guzzle": "^7.0.1",
"innocenzi/laravel-vite": "0.2.*",
"intervention/image": "^2.3",
"jasonmccreary/laravel-test-assertions": "^2.0",
"laravel/framework": "^8.0",
"laravel/helpers": "^1.1",
"laravel/sanctum": "^2.6",
"laravel/tinker": "^2.0",
"laravel/ui": "^3.0",
"lavary/laravel-menu": "^1.8",
"league/flysystem-aws-s3-v3": "^1.0",
"predis/predis": "^1.1",
"silber/bouncer": "v1.0.0-rc.10",
"spatie/flysystem-dropbox": "^1.2",
"spatie/laravel-backup": "^6.11",
"spatie/laravel-medialibrary": "^8.7",
"vinkla/hashids": "^9.0"
},
"require-dev": {
"barryvdh/laravel-debugbar": "^3.7",
"barryvdh/laravel-ide-helper": "^2.6",
"beyondcode/laravel-dump-server": "^1.0",
"facade/ignition": "^2.3.6",
"fakerphp/faker": "^1.9.1",
"friendsofphp/php-cs-fixer": "^3.0",
"mockery/mockery": "^1.3.1",
"nunomaduro/collision": "^5.0",
"pestphp/pest": "^1.0",
"pestphp/pest-plugin-faker": "^1.0",
"pestphp/pest-plugin-laravel": "^1.0",
"pestphp/pest-plugin-parallel": "^0.2.1",
"phpunit/phpunit": "^9.3"
},
"autoload": {
"psr-4": {
"Probelian\": "app/",
"Database\Factories\": "database/factories/",
"Database\Seeders\": "database/seeders/",
"Modules\": "Modules/"
},
"files": [
"app/Space/helpers.php"
]
},
"autoload-dev": {
"psr-4": {
"Tests\": "tests/"
}
},
"minimum-stability": "dev",
"prefer-stable": true,
"scripts": {
"post-autoload-dump": [
"Illuminate\Foundation\ComposerScripts::postAutoloadDump",
"@php artisan package:discover --ansi"
],
"post-root-package-install": [
"@php -r \"file_exists('.env') || copy('.env.example', '.env');\""
],
"post-create-project-cmd": [
"@php artisan key:generate --ansi"
]
},
"config": {
"optimize-autoloader": true,
"preferred-install": "dist",
"sort-packages": true,
"allow-plugins": {
"pestphp/pest-plugin": true
}
},
"extra": {
"laravel": {
"dont-discover": []
}
}
}
@srigurubyo feel free to make a new thread describing your problem and we can try to help
@Sinnbeck Thank you!
When i run npm run dev command i get the following lines of code,. Please can someone help me out
npm run dev
dev vite
VITE v3.1.8 ready in 476 ms
➜ Local: http://localhost:5173/ ➜ Network: use --host to expose
LARAVEL v9.36.3 plugin v0.6.1
➜ APP_URL: http://localhost
@gilan_codes That sounds like it is working. But if you are having problems, please create your own thread :)
@Sinnbeck Sir, I do not think it is working because i can't find the css updates(That is the colours...) in my page(in the browser) . Please what do you mean by threads.How do i go about creating it. I am a beginner in laravel
@gilan_codes Go to this page https://laracasts.com/discuss and click "New Discussion". Then fill out the form with your question and submit it :)
@Sinnbeck okay sir
In package.json, if set "type" : "module" , i get this errror, when i remove it is work, node 18.14.0
@devarruda Laravel's Vite plugin isn't compatible with ESM modules as of yet. A pull request is in the works for it though.
i have the same problem and i solved it by updating "vite" to 4.1.1 from packet.json its work for me now
Please or to participate in this conversation.