vuejs sample app npm run dev not working throwing Error: Cannot find module 'node:url'

Viewed 117

I am new to vuejs I am following the below steps to create my vue js app in the local system.

Step:

npm init vue@latest

✔ Project name: … VueDemo ✔ Add TypeScript? … No / Yes ✔ Add JSX Support? … No / Yes ✔ Add Vue Router for Single Page Application development? … No / Yes ✔ Add Pinia for state management? … No / Yes ✔ Add Vitest for Unit testing? … No / Yes ✔ Add Cypress for both Unit and End-to-End testing? … No / Yes ✔ Add ESLint for code quality? … No / Yes ✔ Add Prettier for code formatting? … No / Yes

Scaffolding project in ./VueDemo Done.

cd VueDemo npm install npm run dev

It's throwing the following error in the console:

failed to load config from /Users/ashok/MyStudy/Vue/VueDemo/vite.config.js error when starting dev server: Error: Cannot find module 'node:url' Require stack:

  • /Users/ashok/MyStudy/Vue/VueDemo/vite.config.js
  • /Users/ashok/MyStudy/Vue/VueDemo/node_modules/vite/dist/node/chunks/dep-0fc8e132.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. (/Users/ashok/MyStudy/Vue/VueDemo/vite.config.js:31:23) at Module._compile (internal/modules/cjs/loader.js:1072:14) at Object._require.extensions. [as .js] (file:///Users/ashok/MyStudy/Vue/VueDemo/node_modules/vite/dist/node/chunks/dep-0fc8e132.js:63096:24) at Module.load (internal/modules/cjs/loader.js:937:32) at Function.Module._load (internal/modules/cjs/loader.js:778:12) at Module.require (internal/modules/cjs/loader.js:961:19)

Package.json file:

{
  "name": "vuedemo",
  "version": "0.0.0",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview --port 4173"
  },
  "dependencies": {
    "vue": "^3.2.37"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^3.0.1",
    "vite": "^3.0.4"
  }
} 

vite.config.js:

import { fileURLToPath, URL } from 'node:URL

import { defineConfig } from 'vite'
import Vue from '@vitejs/plugin-vue'

export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  }
})
0 Answers
Related