Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

npm build and run errors #80

Open
justb4 opened this issue Nov 29, 2021 · 2 comments
Open

npm build and run errors #80

justb4 opened this issue Nov 29, 2021 · 2 comments

Comments

@justb4
Copy link

justb4 commented Nov 29, 2021

Thanks @ClintOxx for this awesome project! Hopefully we can all help here to maintain.

Getting various build and run errors due to outdated and deprecated package versions.
Resolved locally, will submit PR. Context:

  • M-Dash version on master as on nov 29, 2021
  • Mac OSX
  • node v16.13.0, npm 8.1.0, @vue/cli 4.5.15, installed with Homebrew and nvm

First try with plain npm install

$ npm install
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/eslint
npm ERR!   dev eslint@"7.0.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer eslint@">= 1.6.0 < 7.0.0" from @vue/[email protected]
npm ERR! node_modules/@vue/cli-plugin-eslint
npm ERR!   dev @vue/cli-plugin-eslint@"^4.5.13" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! See [MY_HOMEDIR]/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     [MY_HOMEDIR]/.npm/_logs/2021-11-28T15_41_43_606Z-debug.log

Next tried install with npm install --legacy-peer-deps to suppress dependency errors. Output:

$ npm install --legacy-peer-deps
npm WARN deprecated @hapi/[email protected]: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated @hapi/[email protected]: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated [email protected]: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated [email protected]: this library is no longer supported
npm WARN deprecated [email protected]: This loader has been deprecated. Please use eslint-webpack-plugin
npm WARN deprecated [email protected]: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated [email protected]: Sorry but vue-analytics is no longer maintained. I would suggest you switch to vue-gtag, with love, the guy who made the package.
npm WARN deprecated [email protected]: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
npm WARN deprecated [email protected]: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated [email protected]: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
npm WARN deprecated [email protected]: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated [email protected]: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated [email protected]: 3.x is no longer supported
npm WARN deprecated [email protected]: babel-eslint is now @babel/eslint-parser. This package will no longer receive updates.
npm WARN deprecated @hapi/[email protected]: Moved to 'npm install @sideway/address'
npm WARN deprecated [email protected]: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated @hapi/[email protected]: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated @hapi/[email protected]: Switch to 'npm install joi'
npm WARN deprecated [email protected]: This SVGO version is no longer supported. Upgrade to v2.x.x.
npm WARN deprecated [email protected]: This version of tar is no longer supported, and will not receive security updates. Please upgrade asap.
npm ERR! code 1
npm ERR! path [MY_HOMEDIR]/............./node_modules/node-sass
npm ERR! command failed
npm ERR! command sh -c node scripts/build.js
npm ERR! Building: [MY_HOMEDIR]/.nvm/versions/node/v16.13.0/bin/node [MY_HOMEDIR]/............./node_modules/node-gyp/bin/node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
npm ERR! gyp info it worked if it ends with ok
npm ERR! gyp verb cli [
npm ERR! gyp verb cli   '[MY_HOMEDIR]/.nvm/versions/node/v16.13.0/bin/node',
npm ERR! gyp verb cli   '[MY_HOMEDIR]/............./node_modules/node-gyp/bin/node-gyp.js',
npm ERR! gyp verb cli   'rebuild',
npm ERR! gyp verb cli   '--verbose',
npm ERR! gyp verb cli   '--libsass_ext=',
npm ERR! gyp verb cli   '--libsass_cflags=',
npm ERR! gyp verb cli   '--libsass_ldflags=',
npm ERR! gyp verb cli   '--libsass_library='
npm ERR! gyp verb cli ]
npm ERR! gyp info using [email protected]
npm ERR! gyp info using [email protected] | darwin | x64
npm ERR! gyp verb command rebuild []
npm ERR! gyp verb command clean []
npm ERR! gyp verb clean removing "build" directory
npm ERR! gyp verb command configure []
npm ERR! gyp verb check python checking for Python executable "python2" in the PATH
npm ERR! gyp verb `which` succeeded python2 [MY_HOMEDIR]/.pyenv/shims/python2
npm ERR! gyp ERR! configure error 
.
.
npm ERR! gyp ERR! System Darwin 18.7.0
npm ERR! gyp ERR! command "[MY_HOMEDIR]/.nvm/versions/node/v16.13.0/bin/node" "[MY_HOMEDIR]/............./node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
npm ERR! gyp ERR! cwd [MY_HOMEDIR]/............./node_modules/node-sass
npm ERR! gyp ERR! node -v v16.13.0
npm ERR! gyp ERR! node-gyp -v v3.8.0
npm ERR! gyp ERR! not ok 
npm ERR! Build failed with error code: 1

npm ERR! A complete log of this run can be found in:
npm ERR!     [MY_HOMEDIR]/.npm/_logs/2021-11-29T10_06_10_185Z-debug.log

Main error is gyp build. Even if I configure to use python 2.7 with pyenv, I keep getting gyp errors. Problem is that the library node-sass requires Python2 to build, but Python2 is also EOL. Replacing with "sass": "1.43.5" think, written in Dart, gets rid of this problem. Now could run npm install --legacy-peer-deps OK.

Trying to run: npm run dev --open got eslint errors, though non-fatal.

 WARNING  Compiled with 1 warning
Parsing error: require() of ES Module require-from-eslint.js not supported
https://stackoverflow.com/questions/69554485/eslint-error-must-use-import-to-load-es-module

Solution: replace "babel-eslint": "^10.1.0" with "@babel/eslint-parser": "^7.16.3".

Now almost there: "multiword" rule Vue Style issues:

.. /src/components/core/Footer.vue
  1:1  error  Component name "Footer" should always be multi-word  vue/multi-word-component-names

[MY_HOMEDIR]/......./src/components/error/Error.vue
  1:1  error  Component name "Error" should always be multi-word  vue/multi-word-component-names

[MY_HOMEDIR]/......../src/components/materialfy/Calendar.vue
  1:1  error  Component name "Calendar" should always be multi-word  vue/multi-word-component-names

# etc

Can be suppressed by listing single word exceptions in eslintrc.js
See https://eslint.vuejs.org/rules/multi-word-component-names.html.

{
  "vue/multi-word-component-names": ["error", {
    "ignores": ['Footer', 'Error', etc]
  }]
}

Also upgraded many versions in package.json, final build result, still with npm install --legacy-peer-deps :

npm WARN deprecated @hapi/[email protected]: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated @hapi/[email protected]: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated [email protected]: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated [email protected]: this library is no longer supported
npm WARN deprecated [email protected]: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated [email protected]: Sorry but vue-analytics is no longer maintained. I would suggest you switch to vue-gtag, with love, the guy who made the package.
npm WARN deprecated [email protected]: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
npm WARN deprecated [email protected]: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated [email protected]: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
npm WARN deprecated [email protected]: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated [email protected]: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated [email protected]: 3.x is no longer supported
npm WARN deprecated @hapi/[email protected]: Moved to 'npm install @sideway/address'
npm WARN deprecated [email protected]: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated @hapi/[email protected]: This version has been deprecated and is no longer supported or maintained
npm WARN deprecated @hapi/[email protected]: Switch to 'npm install joi'
npm WARN deprecated [email protected]: This SVGO version is no longer supported. Upgrade to v2.x.x.

No warnings on run, app runs in browser ok, at least with two runtime errors. These also found in official demo, so may need separate issues/PRs:

  1. When logging in and then logout JS console shows repeating error:
Uncaught TypeError: Cannot read properties of undefined (reading 'updateSeries')
    at s.updateSeriesLine (ApexLineGraph.vue:92)
    at ApexLineGraph.vue:87
    at n (helpers.js:72)
updateSeriesLine @ ApexLineGraph.vue:92
(anonymous) @ ApexLineGraph.vue:87
n @ helpers.js:72
  1. Errors from Sentry remote calls: Failed to load resource: net::ERR_BLOCKED_BY_CLIENT, but could be due to my browser (Brave).

As said will PR shortly.

@justb4
Copy link
Author

justb4 commented Dec 1, 2021

Wanted to get rid of using npm install --legacy-peer-dep. Finally completely re-scaffolded the project using global install of node v16.13.0, npm 8.1.0 and @vue/cli 4.5.15:

  • created a new project with vue create with custom options, selecting vuex and router
  • vue added vuetify
  • adding each dependency with npm install
  • same for devDependencies
  • increased versions
  • lots of tweaking needed to get rid of mainly eslinting errors due to version conflicts

justb4@b4d1ec8 now has working version though some eslinting has been disabled. But a clean build without JS console errors (except for those mentioned earlier), using:

rm -rf node_modules package-lock.json 
npm cache clean --force
npm install
npm run serve

@ClintOxx
Copy link
Collaborator

ClintOxx commented Dec 1, 2021

Cool thanks man! I'll give it a look over when I have some free time but this is appreciated

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants