search

olefredrik / FoundationPress

FoundationPress is a WordPress starter theme based on Foundation 6 by Zurb
https://foundationpress.olefredrik.com
MIT License
2.71k stars 871 forks source link

npm start not working, tried many solves :| #1328

Closed luukee closed 5 years ago

luukee commented 5 years ago

How can this bug be reproduced?

  1. renamed the foundationpress theme folder
  2. ran into multiple issues.
  3. copy and pasted package.json and package-lock.json from this repo to my theme's, respective, files as a fix.
  4. Deleted the node_modules folder
  5. run npm install on the theme folder

What did you expect to happen? I expected npm to install so I could boot up and run the site in the localhost:8888 window

What happened instead? Atom (the editor) freezes, as well as terminal and I get this error in terminal:

Unhandled rejection Error: Command failed: /usr/local/bin/git checkout 4.0
error: pathspec '4.0' did not match any file(s) known to git

    at ChildProcess.exithandler (child_process.js:289:12)
    at ChildProcess.emit (events.js:182:13)
    at maybeClose (internal/child_process.js:962:16)
    at Socket.stream.socket.on (internal/child_process.js:381:11)
    at Socket.emit (events.js:182:13)
    at Pipe._handle.close (net.js:606:12)

⸨            ░░░░░░⸩ ⠦ extract:fsevents: sill extract is-accessor-descriptor@1.

Please List the Following:

Please help, this is driving me wild. Haha.

Thanks! Luke

DeiCha commented 5 years ago

Just read fixes: https://github.com/olefredrik/FoundationPress/issues/1312 https://github.com/olefredrik/FoundationPress/issues/1316 ( probably problem is releated with gulp package)

Sadly can't help with atom (using sublime) but it could happen if you don't exclude node_modules folder when importing project.

luukee commented 5 years ago

@DeiCha Thank you!

Your reply here fixed it for me.

Also, I'm using nvm to downgrade to node version 6.11.5.

After installing nvm I ran this to check which version I was on:

node -v

Then I ran

nvm use 6

. . . then I started at your second bullet point:

Everything works!

**although I still have these "deprecated" warnings:

npm WARN deprecated babel-preset-es2015@6.24.1: 🙌 Thanks for using Babel: we recommend using babel-preset-env now: please read babeljs.io/env to update! npm WARN deprecated gulp-util@3.0.8: gulp-util is deprecated - replace it, following the guidelines at https://medium.com/gulpjs/gulp-util-ca3b1f9f9ac5 npm WARN deprecated browserslist@1.7.7: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools. npm WARN deprecated wreck@6.3.0: This version is no longer maintained. Please upgrade to the latest version. npm WARN deprecated hoek@2.16.3: This version is no longer maintained. Please upgrade to the latest version. npm WARN deprecated boom@2.10.1: This version is no longer maintained. Please upgrade to the latest version. npm WARN prefer global node-gyp@3.8.0 should be installed with -g

And on npm start I see this failed to load:

[09:40:24] Failed to load external module @babel/register

But it FINALLY works!

Thanks again @DeiCha!

FlatspinZA commented 5 years ago

Try running npm audit fix, which will still leave you with some warnings which can be fixed with npm audit fix --force

There is one last issue that needs to be manually fixed. --force won't fix it, but if you run npm audit fix again, it will allow you to scroll & update the package manually.

Nothing broke for me as far as I can tell.

luukee commented 5 years ago

Thanks! I’ll give it a try.

luukee commented 5 years ago

@FlatspinZA

Try running npm audit fix, which will still leave you with some warnings which can be fixed with npm audit fix --force

On running npm audit fix I received this error: npm ERR! Invalid Version: github:gulpjs/gulp#71c094a51c7972d26f557899ddecab0210ef3776 . . . should I risk the npm audit fix --force? I ask because I'm pretty far into the theme build and I don't want to lose all of my work, or mess something up (I'm a newbie with command line stuff :).

Admittedly, primary reasons being: I just now pushed the theme to GitHub. I should've done it a long time ago :|

I also wanted to show you some of the peculiar SASS warnings I get when I run npm start:

Luke-MacBook-Prolocal:comedy-dynamics lukecarlhartman$ npm start

> foundationpress@2.10.4 start /Users/lukecarlhartman/Sites/comedydynamics/wp-content/themes/comedy-dynamics
> gulp

[19:55:19] Failed to load external module @babel/register
[19:55:19] Requiring external module babel-register
[19:55:21] Loading config file...
[19:55:21] config.yml exists, loading config.yml
[19:55:21] Using gulpfile ~/Sites/comedydynamics/wp-content/themes/comedy-dynamics/gulpfile.babel.js
[19:55:21] Starting 'default'...
[19:55:21] Starting 'build'...
[19:55:21] Starting 'clean'...
[19:55:21] Finished 'clean' after 32 ms
[19:55:21] Starting 'sass'...
[19:55:21] Starting 'webpack:build'...
[19:55:21] Starting 'images'...
[19:55:21] Starting 'copy'...
[19:55:22] Finished 'copy' after 969 ms
DEPRECATION WARNING: Passing a string to call() is deprecated and will be illegal
in Sass 4.0. Use call(get-function("shake")) instead.

DEPRECATION WARNING: Passing a string to call() is deprecated and will be illegal
in Sass 4.0. Use call(get-function("shake")) instead.

DEPRECATION WARNING: Passing a string to call() is deprecated and will be illegal
in Sass 4.0. Use call(get-function("spin")) instead.

DEPRECATION WARNING: Passing a string to call() is deprecated and will be illegal
in Sass 4.0. Use call(get-function("spin")) instead.

DEPRECATION WARNING: Passing a string to call() is deprecated and will be illegal
in Sass 4.0. Use call(get-function("wiggle")) instead.

DEPRECATION WARNING: Passing a string to call() is deprecated and will be illegal
in Sass 4.0. Use call(get-function("wiggle")) instead.

WARNING: flex-grid-row-align(): flex-start is not a valid value for horizontal alignment. Use left, right, center, justify, or spaced.
         on line 38 of node_modules/foundation-sites/scss/util/_flex.scss, in mixin `flex-align`
         from line 16 of src/assets/scss/components/_featured-image.scss, in mixin `@content`
         from line 165 of node_modules/foundation-sites/scss/util/_breakpoint.scss, in mixin `breakpoint`
         from line 5 of src/assets/scss/components/_featured-image.scss
         from line 78 of src/assets/scss/app.scss

WARNING: flex-grid-row-align(): center is not a valid value for vertical alignment. Use top, bottom, middle, or stretch.
         on line 47 of node_modules/foundation-sites/scss/util/_flex.scss, in mixin `flex-align`
         from line 41 of src/assets/scss/components/_featured-image.scss
         from line 78 of src/assets/scss/app.scss

WARNING: flex-grid-row-align(): center is not a valid value for vertical alignment. Use top, bottom, middle, or stretch.
         on line 47 of node_modules/foundation-sites/scss/util/_flex.scss, in mixin `flex-align`
         from line 45 of src/assets/scss/components/_featured-image.scss
         from line 78 of src/assets/scss/app.scss

WARNING: flex-grid-row-align(): center is not a valid value for vertical alignment. Use top, bottom, middle, or stretch.
         on line 47 of node_modules/foundation-sites/scss/util/_flex.scss, in mixin `flex-align`
         from line 11 of src/assets/scss/components/_accordion.scss
         from line 81 of src/assets/scss/app.scss

Any of your suggestions are greatly appreciated 👍

Thanks so much for your help! -Luke

derweili commented 5 years ago

This was an error with the gulp dependency. It is already fixed

To solve this problem in your project follow these steps:

  1. Delete the node_modules folder.
  2. Open the package.json
  3. Search for"gulp": "gulpjs/gulp#4.0", and replace it with "gulp": "^4.0",
  4. Make sure you have node version 6.11.xx installed
  5. Run npm install