Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

vue.js - I'm getting an error when running my project

sudo npm run serve

> [email protected] serve /home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda
> vue-cli-service serve

 INFO  Starting development server...
12% building 20/21 modules 1 active ...rojetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/@vue/cli-service/node_modules/webpack/buildin/global.js/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/webpack/lib/Dependency.js:226
                throw new Error(
                ^

Error: module property was removed from Dependency (use compilation.moduleGraph.updateModule(dependency, module) instead)
    at ProvidedDependency.set (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/webpack/lib/Dependency.js:226:9)
    at iterationDependencies (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/@vue/cli-service/node_modules/webpack/lib/Compilation.js:940:21)
    at factory.create (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/@vue/cli-service/node_modules/webpack/lib/Compilation.js:950:8)
    at factory (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/@vue/cli-service/node_modules/webpack/lib/NormalModuleFactory.js:409:6)
    at hooks.afterResolve.callAsync (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/@vue/cli-service/node_modules/webpack/lib/NormalModuleFactory.js:155:13)
    at _fn0 (eval at create (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/@vue/cli-service/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:14:1)
    at fileExistsWithCase (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/case-sensitive-paths-webpack-plugin/index.js:158:9)
    at that.fileExistsWithCase (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/case-sensitive-paths-webpack-plugin/index.js:113:7)
    at that.fileExistsWithCase (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/case-sensitive-paths-webpack-plugin/index.js:113:7)
    at CaseSensitivePathsPlugin.fileExistsWithCase (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/case-sensitive-paths-webpack-plugin/index.js:83:5)
    at that.getFilenamesInDir (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/case-sensitive-paths-webpack-plugin/index.js:106:10)
    at CaseSensitivePathsPlugin.getFilenamesInDir (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/case-sensitive-paths-webpack-plugin/index.js:51:5)
    at CaseSensitivePathsPlugin.fileExistsWithCase (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/case-sensitive-paths-webpack-plugin/index.js:89:8)
    at that.getFilenamesInDir (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/case-sensitive-paths-webpack-plugin/index.js:106:10)
    at Array.fs.readdir (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/case-sensitive-paths-webpack-plugin/index.js:67:5)
    at Storage.finished (/home/shinier01/Projetos/EstudanaIrlanda/frontend-estudenairlanda/node_modules/@vue/cli-service/node_modules/enhanced-

    resolve/lib/CachedInputFileSystem.js:55:16)
    npm ERR! code ELIFECYCLE
    npm ERR! errno 1
    npm ERR! [email protected] serve: `vue-cli-service serve`
    npm ERR! Exit status 1
    npm ERR! 
    npm ERR! Failed at the [email protected] serve script.
    npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
    
    npm ERR! A complete log of this run can be found in:
    npm ERR!     /home/shinier01/.npm/_logs/2020-11-10T18_21_27_165Z-debug.log

I tried to uninstall npm, vue and node, I deleted the .json files, but somehow nothing solves, and I always have this error when executing my command.

but this project is already running normally before, and now I gave an npm install and it updated the packages, but even if I give a roolbakc, or delete and install it again, nothing resolves.

    {
  "name": "frontend",
  "version": "1.0.0",
  "description": "A Vue.js project",
  "author": ".....",
  "private": true,
  "scripts": {
    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
    "start": "npm run dev",
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "@vue/cli": "^4.5.8",
    "@vue/cli-service": "^4.5.8",
    "axios": "^0.20.0",
    "buefy": "^0.9.3",
    "firebase": "^7.22.0",
    "vue": "^2.6.12",
    "vue-router": "^3.0.1"
  },
  "devDependencies": {
    "autoprefixer": "^7.1.2",
    "babel-core": "^6.22.1",
    "babel-helper-vue-jsx-merge-props": "^2.0.3",
    "babel-loader": "^7.1.1",
    "babel-plugin-syntax-jsx": "^6.18.0",
    "babel-plugin-transform-runtime": "^6.22.0",
    "babel-plugin-transform-vue-jsx": "^3.5.0",
    "babel-preset-env": "^1.3.2",
    "babel-preset-stage-2": "^6.22.0",
    "chalk": "^2.0.1",
    "copy-webpack-plugin": "^6.3.0",
    "css-loader": "^5.0.1",
    "extract-text-webpack-plugin": "^2.1.2",
    "file-loader": "^1.1.4",
    "friendly-errors-webpack-plugin": "^1.6.1",
    "html-webpack-plugin": "^2.30.1",
    "node-notifier": "^5.1.2",
    "optimize-css-assets-webpack-plugin": "^3.2.0",
    "ora": "^1.2.0",
    "portfinder": "^1.0.13",
    "postcss-import": "^11.0.0",
    "postcss-loader": "^2.0.8",
    "postcss-url": "^7.2.1",
    "rimraf": "^2.6.0",
    "semver": "^5.3.0",
    "shelljs": "^0.7.6",
    "uglifyjs-webpack-plugin": "^1.1.1",
    "url-loader": "^4.1.1",
    "vue-loader": "^13.3.0",
    "vue-style-loader": "^3.0.1",
    "vue-template-compiler": "^2.5.2",
    "webpack": "^5.4.0",
    "webpack-bundle-analyzer": "^4.1.0",
    "webpack-cli": "^4.2.0",
    "webpack-dev-server": "^3.11.0",
    "webpack-merge": "^4.1.0"
  },
  "engines": {
    "node": ">= 6.0.0",
    "npm": ">= 3.0.0"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ]
}

can someone help me solve this error, please?

like image 409
Marcius Leandro Avatar asked Nov 10 '20 18:11

Marcius Leandro


People also ask

How do I run vue project in browser?

Open in browser To view the project, open a tab and type http://localhost:3000 into the URL bar. That's the address that the Node server is listening to. You should now see this page, which is the basic structure of our project.

How do I fix vue is not defined?

To fix 'Vue is not defined' with Vue. js, we add the Vue script before we create Vue instance. to create a Vue instance after the Vue script tag.

How do you fix vue is not recognized as an internal or external command operable program or batch file?

To solve the error "'vue' is not recognized as an internal or external command, operable program or batch file", install the @vue/cli package globally by running npm install -g @vue/cli , restart your terminal and make sure your PATH environment variable is set up correctly.


1 Answers

I faced the same problem and found a solution.

In my case application started using V5 of webpack and it was built on V4. You can run: npm i -D webpack@^4.0.0 to reverse it to V4 and it should fix it.

Special thanks to Mark: https://forum.layer0.co/t/error-module-property-was-removed-from-dependency/208

like image 165
IProgramSometimes Avatar answered Oct 22 '22 01:10

IProgramSometimes