[Bug]: vue3+vite project cannot be started

[githublmy]

What happened?

vue3+vite project cannot be started

Version

1.0.459

CLI command to start your dev tool

pnpm dev

Steps to reproduce (or sample repo)

新建vue3+vite项目，pnpm dev运行不了

Log output

PS D:\Project\vue-project> pnpm dev

> vue-project@0.0.0 dev D:\Project\vue-project
> vite

✔ Console Ninja extension is connected to Vite, see https://tinyurl.com/2vt8jxzw

[smcenlly]

Can you please provide your log output from the ~/.console-ninja/trace.log file in your user home directory?

You mentioned that your project cannot be started:

• Do you mean that Console Ninja doesn't work for you? If Console Ninja is not working, can you please describe the steps that you are taking after starting your dev tools? (e.g. adding console log, opening your project in the browser, etc.)
• Or do you mean that there is an error that stops your project from working? If so, can you please provide details of the error?

[elanboms]

✔ Console Ninja extension is connected to Vite
but Uncaught (in promise) ReferenceError: defineProps is not defined?????

[smcenlly]

@elanboms

If your project is a vue3 + vite project, can you please provide:

• The output of the ~/.console-ninja/trace.log file in your user home directory
• A reproducible sample or set of instructions to reproduce the error

If your project is not a vue3 + vite project, can you please create a new issue with the details requested in our issue template.

[Shaoronggang]

Needed to uninstall and reinstall node-modules, and then re-run the project to make your pnpm dev work again.

[PatrickKennedy]

Having the same issue where vite "starts" but immediately exits. Only started with a recent update to the extension (I believe, at the very least the welcome screen had popped up again)

pnpm vite
✔ Console Ninja extension is connected to Vite, see https://tinyurl.com/2vt8jxzw

I was able to resolve it by nuking node_modules as suggested by Shaoronggang. I don't have any steps to reproduce sadly

trace.log output

09:36:08.619 info buildHook-33100 installing build hook for vite at , node v24.1.0
09:36:08.626 info buildHook-33100 allowed tools: vite, angular, jest, webpack, next.js, nest.js, cypress, http-server, serve, live-server, nuxt, remix, qwik, hydrogen, serverless, astro, node
09:36:08.626 info buildHook-33100 running tools: vite
09:36:08.628 info buildHook-33100 installing fs interceptor
09:36:08.631 info host client connected: buildHook { address: '127.0.0.1', family: 'IPv4', port: 51118 }
09:36:08.676 info buildHook-33100 file processed (stat): 3 log points, error handler: false, network logging handler: false
09:36:08.679 info buildHook-33100 file processed (stat): 0 log points, error handler: false, network logging handler: false
09:36:08.680 info buildHook-33100 file processed (stat): 0 log points, error handler: false, network logging handler: false
09:36:08.718 info buildHook-33100 file processed (stat): 302 log points, error handler: false, network logging handler: false
09:36:08.721 info buildHook-33100 file processed (stat): 0 log points, error handler: false, network logging handler: false
09:36:08.735 info buildHook-33100 file processed (stat): 8 log points, error handler: false, network logging handler: false
09:36:08.740 info buildHook-33100 file processed (stat): 12 log points, error handler: false, network logging handler: false
09:36:08.760 info buildHook-33100 file processed (stat): 14 log points, error handler: false, network logging handler: false
09:36:08.762 info buildHook-33100 file processed (stat): 0 log points, error handler: false, network logging handler: false
09:36:08.794 info buildHook-33100 file processed (stat): 0 log points, error handler: false, network logging handler: false
09:36:08.818 info buildHook-33100 file processed (stat): 39 log points, error handler: false, network logging handler: false
09:36:08.828 info buildHook-33100 file processed (stat): 0 log points, error handler: false, network logging handler: false
09:36:08.832 info buildHook-33100 file processed (stat): 0 log points, error handler: false, network logging handler: false
09:36:08.833 info buildHook-33100 file processed (stat): 0 log points, error handler: false, network logging handler: false
09:36:08.836 info buildHook-33100 file processed (stat): 0 log points, error handler: false, network logging handler: false
09:36:08.838 info buildHook-33100 file processed (stat): 0 log points, error handler: false, network logging handler: false
09:36:08.841 info buildHook-33100 file processed (stat): 0 log points, error handler: false, network logging handler: false
09:36:08.845 info buildHook-33100 file processed (stat): 0 log points, error handler: false, network logging handler: false
09:36:08.847 info buildHook-33100 file processed (stat): 0 log points, error handler: false, network logging handler: false
09:36:08.848 info buildHook-33100 file processed (stat): 0 log points, error handler: false, network logging handler: false
09:36:08.851 info buildHook-33100 file processed (stat): 0 log points, error handler: false, network logging handler: false
09:36:08.852 info buildHook-33100 allowed tools: vite, angular, jest, webpack, next.js, nest.js, cypress, http-server, serve, live-server, nuxt, remix, qwik, hydrogen, serverless, astro, node
09:36:08.852 info buildHook-33100 running tools: vite
09:36:08.854 info host client disconnected: buildHook 4100
09:36:08.854 info host client disconnected: buildHook 4100, has clients false

[smcenlly]

@PatrickKennedy - was the trace.log output the entirety of your log? It looks to be truncated and missing some log entries. If you didn't provide the full log, can you please do so?

Can you please provide a sample repo that has your problem? At the very least, can you please provide your package.json and vite configuration file(s)?

[PatrickKennedy]

Yeah, that was the full log output, I had even cleared the log first to make sure. I'll see about providing a sample repo if I have some time (this Laravel/Vue framework relationship is honestly still pretty unfamiliar to me and last time I tried to make a test bed for myself I gave up).

With some more testing I am inconsistently able to reproduce it by:

• killing vite
• installing extension version 1.0.464
• restarting the extension host
• updating to latest (1.0.467 as of this posting),
• restarting the host again
• running vite

When it happens I'm able to resolve it by nuking node_modules running pnpm i and running vite again. I was trying to keep an eye on the extension state. One time I reproduced it when running 1.0.464 it was inactive finding no dependencies, another it paused entirely when installing 1.0.464 and updating to 1.0.467 and forcing it to run then broke vite

Here's all the logs from the various attempts to reproduce it, I don't know if there's something obvious to indicate the, I believe, two prior examples of the bug, but the most recent logs are definite example of a reproduction
trace.log

I tried installing 1.0.465 and 1.0.466 and didn't have the bug happen with them, but it might just not have been feeling it at the time.

Here are the configs:
package.json
vite.config.js

package.json

{
  "private": true,
  "type": "module",
  "scripts": {
    "build": "vite build",
    "build:storybook": "storybook build",
    "dev": "npm-run-all --parallel dev:*",
    "dev:server": "vite",
    "dev:storybook": "storybook dev -p 6006 --no-open",
    "lint": "eslint",
    "lint:fix": "eslint --fix",
    "format": "prettier --check '**/*.{js,ts,vue}'",
    "format:fix": "prettier --write '**/*.{js,ts,vue}'"
  },
  "devDependencies": {
    "@chromatic-com/storybook": "3",
    "@eslint/js": "^9.32.0",
    "@prettier/plugin-pug": "^3.4.2",
    "@storybook/addon-essentials": "^8.6.14",
    "@storybook/addon-onboarding": "^8.6.14",
    "@storybook/blocks": "^8.6.14",
    "@storybook/experimental-addon-test": "^8.6.14",
    "@storybook/test": "^8.6.14",
    "@storybook/vue3": "^8.6.14",
    "@storybook/vue3-vite": "^8.6.14",
    "@tsconfig/node22": "^22.0.2",
    "@types/node": "^24.2.0",
    "@vitejs/plugin-vue": "^5.2.0",
    "@vitest/browser": "^3.1.4",
    "@vitest/coverage-v8": "^3.1.4",
    "@vitest/eslint-plugin": "^1.3.4",
    "@vue/compat": "^3.5.13",
    "@vue/compiler-sfc": "^3.5.13",
    "@vue/eslint-config-typescript": "^14.6.0",
    "@vue/language-plugin-pug": "^3.0.5",
    "@vue/test-utils": "^2.4.6",
    "@vue/tsconfig": "^0.7.0",
    "cross-env": "^5.1",
    "dotenv": "^16.4.7",
    "eslint": "^9.31.0",
    "eslint-config-prettier": "^10.1.8",
    "eslint-plugin-import": "^2.32.0",
    "eslint-plugin-vue": "^10.3.0",
    "eslint-plugin-vue-pug": "1.0.0-alpha.3",
    "globals": "^16.3.0",
    "jsdom": "^26.1.0",
    "laravel-vite-plugin": "^1.0.6",
    "lint-staged": "^16.1.2",
    "npm-run-all2": "^7.0.2",
    "playwright": "^1.51.1",
    "prettier": "^3.6.2",
    "pug": "^3.0.3",
    "resize-observer-polyfill": "^1.5.1",
    "sass": "^1.15.2",
    "storybook": "^8.6.14",
    "typescript": "^5.9.2",
    "typescript-eslint": "^8.39.1",
    "unplugin-auto-import": "^20.0.0",
    "unplugin-vue-components": "^29.0.0",
    "vite": "^5.4.11",
    "vite-plugin-eslint2": "^5.0.4",
    "vitest": "^3.1.4",
    "vue-eslint-parser": "^10.2.0",
    "vue-router-mock": "^2.0.0"
  },
  "dependencies": {
    "@fontsource/source-sans-pro": "^5.1.0",
    "@fontsource/source-serif-pro": "^5.1.0",
    "@mdi/font": "^7.4.47",
    "@tinymce/tinymce-vue": "^6.1.0",
    "@vueuse/core": "^13.7.0",
    "@vueuse/head": "^2.0.0",
    "autosize": "^4.0.2",
    "axios": "^1.7.8",
    "bootstrap": "^5.3.3",
    "bootstrap-datepicker": "^1.9.0",
    "chosen-js": "^1.8.7",
    "datatables.net-bs5": "^2.2.0",
    "datatables.net-select-bs5": "^3.0.0",
    "dayjs": "^1.11.13",
    "font-awesome": "^4.7.0",
    "handlebars": "^4.7.8",
    "jquery": "^3.2",
    "jquery-datatables-checkboxes": "^1.3.0",
    "lodash": "^4.17.21",
    "qs": "^6.14.0",
    "tinymce": "^7.5.1",
    "vite-plugin-vuetify": "^2.1.2",
    "vue": "^3.5.13",
    "vue-cookies": "^1.8.4",
    "vue-resource": "^1.5.3",
    "vue-router": "^4.5.0",
    "vuetify": "^3.9.4",
    "ziggy-js": "^2.5.3"
  }
}

vite.config.js

import path from 'path'
import pluginVue from '@vitejs/plugin-vue'

import dotenv from 'dotenv'

import pluginLaravel from 'laravel-vite-plugin'

import pluginAutoImport from 'unplugin-auto-import/vite'

import pluginComponents from 'unplugin-vue-components/vite'

import { defineConfig, mergeConfig } from 'vite'

import pluginEslint from 'vite-plugin-eslint2'

import pluginVuetify from 'vite-plugin-vuetify'
dotenv.config()
// All the common configurations for the app and Vitest

export const baseConfig = defineConfig({

plugins: [

pluginLaravel({

input: [

'@/app.js',

'@/bootstrap-formhelpers.min.js',

'@/chosen.js',

'@/handlebars.js',

'@/tinymce.js',
    '@/components/courses/app.js',
    '@/components/programs/app.js',

    '@sass/app.scss',
    '@sass/admin.scss',
    '@sass/public.scss',
    '@sass/tabbed-ui.scss',
  ],
  refresh: true,
}),

pluginVue({
  template: {
    transformAssetUrls: {
      // The Vue plugin will re-write asset URLs, when referenced
      // in Single File Components, to point to the Laravel web
      // server. Setting this to `null` allows the Laravel plugin
      // to instead re-write asset URLs to point to the Vite
      // server instead.
      base: null,

      // The Vue plugin will parse absolute URLs and treat them
      // as absolute paths to files on disk. Setting this to
      // `false` will leave absolute URLs un-touched so they can
      // reference assets in the public directory as expected.
      includeAbsolute: false,
    },
  },
}),

/**
 * Provides ESLint warnings and errors in the browser
 * @see https://vite-plugin-eslint2.modyqyw.top/guide/getting-started.html
 */
pluginEslint({
  build: false, // Disable during build until we fix the errors
}),

/**
 * Automatically imports commonly used functions and libraries
 * @see https://github.com/unplugin/unplugin-auto-import
 */
pluginAutoImport({
  imports: [
    'vue',
    'vue-router',
    {
      '@vueuse/core': [
        'useLocalStorage',
        'whenever',
        'until',
        'useIntervalFn',
      ],
      vuetify: ['useTheme', 'useDate', 'useDisplay', 'useLayout'],
    },
  ],
  dirs: ['resources/js/composables'],
  dts: './auto-imports.d.ts', // Generate TypeScript definitions
  eslintrc: {
    enabled: true, // Enable ESLint configuration for auto-imports
    filepath: './eslint.auto-import.js', // Custom ESLint config file
  },
}),

/**
 * Automatically imports Vue components in your project when used in a template
 * @see https://github.com/unplugin/unplugin-vue-components
 */
pluginComponents({
  dirs: ['resources/js/components', 'resources/js/views'],
  dts: './components.d.ts', // Generate TypeScript definitions for components
}),

pluginVuetify({
  autoImport: true, // Automatically import Vuetify components
}),

],
resolve: {

alias: {

'@': path.resolve(__dirname, 'resources/js'),

'@sass': path.resolve(__dirname, 'resources/sass'),

vue: 'vue/dist/vue.esm-bundler.js',

},

},
server: {

hmr: {

host: process.env.VITE_HOST || 'localhost',

},

host: '0.0.0.0',

port: process.env.VITE_PORT || 5173,

},

})
// https://vitejs.dev/config/

export default mergeConfig(

// @ts-expect-error defineConfig is not unwinding it's type to UserConfig

baseConfig,

defineConfig({

define: {

// Make vitest available to non-test files

'import.meta.vitest': 'undefined',

},

optimizeDeps: {

include: ['vuetify'],

},

})

)

[PatrickKennedy]

I'm chucking an updated log file in with another failure state where on 1.0.467 I had run vite and noticed the extension wasn't connecting, so I restarted the extension via the status bar and vite and then vite failed to boot until I did the node_modules song and dance then restarted the extension again via the status bar and it connected fine after vite ran
trace.log

[NikGovorov]

@PatrickKennedy Could you share the contents of
s:\ccctc\laravel-coci-redux\Laravel\node_modules\vite\bin\vite.js
and s:\ccctc\laravel-coci-redux\Laravel\node_modules\.pnpm\vite@5.4.14_@types+node@24.2.0_sass@1.81.0\node_modules\vite\bin\vite.js after reproducing the issue?