Semantic-ui: Cannot install semantic-ui

[betimer]

Cannot install semantic-ui package:
OS: Win 10
node: 8.6
npm: 5.4.2

C:\Repo\vcm-spa>npm install semantic-ui --save
npm WARN deprecated [email protected]: breaking changes from clean-css 4.x. Please install gulp-clean-css 3.x
npm WARN deprecated [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated [email protected]: graceful-fs v3.0.0 and before will fail on node releases >= v7.0. Please update to graceful-fs@^4.0.0 as soon as possible. Use 'npm ls graceful-fs' to find
it in the tree.

[email protected] install C:\Repo\vcm-spa\node_modules\semantic-ui
gulp install

module.js:529
throw err;
^

Error: Cannot find module 'gulp-header'
at Function.Module._resolveFilename (module.js:527:15)
at Function.Module._load (module.js:476:23)
at Module.require (module.js:568:17)
at require (internal/module.js:11:18)
at module.exports (C:\Repo\vcm-spa\node_modules\semantic-ui\tasks\collections\internal.js:21:18)
at Object. (C:\Repo\vcm-spa\node_modules\semantic-ui\tasks\watch.js:51:34)
at Module._compile (module.js:624:30)
at Object.Module._extensions..js (module.js:635:10)
at Module.load (module.js:545:32)
at tryModuleLoad (module.js:508:12)
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] install: gulp install
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] install 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! C:\Users\Xin\AppData\Roaming\npm-cache_logs\2017-10-03T00_07_44_782Z-debug.log

[julzheng]

Delete node_modules folder in semantic ui folder then npm install

[betimer]

Thank you @ylto Same result.
I even create a new proj, and do the npm i semantic-ui, got the same result.

Not sure should it be semantic-ui issue or node version issue (8.6.0)

[julzheng]

Have your run gulp build in your semantic/ folder after npm install?

[betimer]

@ylto It's before that stage. It failed when doing npm install
I've rolled back node version from 8.6 to 8.5, same error result below:

PS C:\Repo\learn-js\random\del6> npm i semantic-ui --save
npm WARN deprecated [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN deprecated [email protected]: graceful-fs v3.0.0 and before will fail on node releases >= v7.0. Please update to graceful-fs@^4.0.0 as soon as possible. Use 'npm ls graceful-fs' to find it i
n the tree.

> [email protected] install C:\Repo\learn-js\random\del6\node_modules\semantic-ui
> gulp install

module.js:529
    throw err;
    ^

Error: Cannot find module 'gulp-header'
    at Function.Module._resolveFilename (module.js:527:15)
    at Function.Module._load (module.js:476:23)
    at Module.require (module.js:568:17)
    at require (internal/module.js:11:18)
    at module.exports (C:\Repo\learn-js\random\del6\node_modules\semantic-ui\tasks\collections\internal.js:21:18)
    at Object.<anonymous> (C:\Repo\learn-js\random\del6\node_modules\semantic-ui\tasks\watch.js:51:34)
    at Module._compile (module.js:624:30)
    at Object.Module._extensions..js (module.js:635:10)
    at Module.load (module.js:545:32)
    at tryModuleLoad (module.js:508:12)

[julzheng]

Try bower. bower install semantic-ui

[awgv]

Hi @betimer, sorry for the delay, I couldn’t reproduce on NPM 5.4.2; gulp-header is in SUI’s dependencies, and I’m not sure why it’s not installing. Run npm install gulp-header --save-dev to see if fixes the issue.

[betimer]

@ylto bower seems can work which is weird. As the prod environment is using npm install

[betimer]

@Banandrew Thank you. I've tried npm install gulp-header --save-dev before install semantic-ui, same error result.

[betimer]

@ylto @Banandrew
Hi thank you guys. I've just fixed the issue, and the root cause is npm cache. After I clear it, issue gets fixed. I will close this issue, and thank you again.

[zugzwang]

Hi guys, I know the issue is closed by I get the same error in Windows 10, when running npm install semantic-ui.
I had another folder with semantic-ui correctly installed the same way. But when it is a new project, it outputs the error. I don't want to copy the node_modules and semantic folder by hand.
You mention that the error is npm cache, would you mind telling me how to clear it?
Thanks

[awgv]

@tal-botvinnik Hello, that would be npm cache clean --force.

[jeff3dx]

It's been a year since the last comment and the issue is closed, but this is still a problem with Semantic UI React (0.87.1) on Mac OS and Ubuntu.

[chinomnsoawazie]

I have done practically everything on this thread and none works!

[lubber-de]

@chinomnsoawazie Try the community fork https://fomantic-ui.com which works with gulp 4 and latest node versions as well

npm uninstall semantic-ui
npm install fomantic-ui

It still compiles to "semantic.css" and "semantic.js" and is backward compatible so far to semantic.

[essvega]

@chinomnsoawazie This really fixed the issue! Thanks

[timbog80]

@chinomnsoawazie Try the community fork https://fomantic-ui.com which works with gulp 4 and latest node versions as well

npm uninstall semantic-ui
npm install fomantic-ui

It still compiles to "semantic.css" and "semantic.js" and is backward compatible so far to semantic.

That doesn't really fix the issue though

[luisafvaca]

I had the same issue today, with 0.88.2 semantic-ui version in mac.
I'm not sure but I resolved it install package using yarn instead of npm.

[Vic-rider]

J'ai eu le même problème aujourd'hui, avec la version 0.88.2 sémantique-ui sous mac.
Je ne suis pas sûr mais j'ai résolu le package d'installation en utilisant yarn au lieu de npm.

me too, i always have this problem but i'm on windows

[Vic-rider]

i'm just trying with https://fomantic-ui.com/

and it work with just one npm install fomantic-ui --save after that, you install jquery too with npm install jquery --save.
after fomantic installing install gulp with npm install -g gulp, open semantic folder in your project root and run gulp build.

You go now to add semantic and jquery parametters in angular.json with that "styles": [ "src/styles.css", "node_modules/semantic/dist/semantic.min.css" ], "scripts": [ "node_modules/jquery/dist/jquery.min.js", "node_modules/semantic/dist/semantic.min.js" ]

remember to move semantic folder in node_modules folder without that, it cannot work.

glad to help ! 🖐🏿

[iamphoenix310]

Hi All, Use npm install semantic-ui-css
Works like a charm :)