0

I'm having a problem with the implementation in Vue + Laravel. This is my second project with laravel and vue with the same ziggy problem, I have the impression it's because I'm using WSL in both projects. See the error below:

enter image description here

[21:05:14.944] Running the build in Washington, D.C., USA (East) - iad1
[21:05:15.362] Cloning github.com/VitorHSilver/barber-shop (Branch: main, Commit: 653b3a9)
[21:05:15.713] Previous build cache not available
[21:05:16.156] Cloning completed: 792.949ms
[21:05:16.525] Running “vercel build”
[21:05:17.061] Vercel CLI 39.3.0
[21:05:17.761] Running the “install” command: `npm install`...
[21:05:23.339] 
[21:05:23.340] added 246 packages and audited 247 packages in 5s
[21:05:23.341] 
[21:05:23.341] 60 packages are looking for funding
[21:05:23.341] run `npm fund` for details
[21:05:23.341] 
[21:05:23.342] found 0 vulnerabilities
[21:05:23.573] Running “yarn run build”
[21:05:23.853] yarn run v1.22.19
[21:05:23.881] $ vue-tsc && vite build
[21:05:28.794] resources/js/app.ts(7,26): error TS2307: Could not find module '../../vendor/tightenco/ziggy' or its corresponding type declarations.
[21:05:28.821] error The command failed with exit code 2.
[21:05:28.822] info Visit https://yarnpkg.com/en/docs/cli/run for documentation on this command.
[21:05:28.834] Error: The command “yarn run build” exited with 2
[21:05:29.131] 

I'm using laravel with vue because I'm going to use API, Notification and DataBase

My file tsconfig.json:

{
    "compilerOptions": {
        "allowJs": true,
        "module": "ESNext",
        "moduleResolution": "bundler",
        "jsx": "preserve",
        "strict": true,
        "isolatedModules": true,
        "target": "ESNext",
        "esModuleInterop": true,
        "forceConsistentCasingInFileNames": true,
        "noEmit": true,
        "skipLibCheck": true,
        "paths": {
            "@/*": ["./resources/js/*"],
           "ziggy-js": ["/vendor/tightenco/ziggy"]
        }
    },
    "include": ["resources/js/**/*.ts", "resources/js/**/*.vue"]
}

APP.ts

import '../css/app.css';
import './bootstrap';
import { createInertiaApp } from '@inertiajs/vue3';
import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers';
import { createApp, DefineComponent, h } from 'vue';
import { ZiggyVue } from '../../vendor/tightenco/ziggy/dist/index.esm';

I tried:

  • run npm install ziggy-js
  • change path in tsconfig.json: ["../../vendor/tightenco/ziggy"] , ["/vendor/ziggy-js/dist/index.esm.js"] ["../../vendor/tightenco/ziggy/dist/index.esm.js"]

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.