search

Semantic-Org / Semantic-UI

Semantic is a UI component framework based around useful principles from natural language.
http://www.semantic-ui.com
MIT License
51.11k stars 4.94k forks source link

[Installation] Unable to install Semantic-UI using NPM #6897

Open viditkothari opened 5 years ago

viditkothari commented 5 years ago

[NPM Installation] Error installing Semantic-UI via NPM install

Steps

The following command to install semantic-ui: $ npm install --save semantic-ui

Actual Result

_results in the following log ( please check the last part of the log )_ : (node:400952) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 drain listeners added to [TLSSocket]. Use emitter.setMaxListeners() to increase limit 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 (node:400952) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 drain listeners added to [TLSSocket]. Use emitter.setMaxListeners() to increase limit (node:400952) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 drain listeners added to [TLSSocket]. Use emitter.setMaxListeners() to increase limit (node:400952) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 drain listeners added to [TLSSocket]. Use emitter.setMaxListeners() to increase limit (node:400952) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 drain listeners added to [TLSSocket]. Use emitter.setMaxListeners() to increase limit (node:400952) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 drain listeners added to [TLSSocket]. Use emitter.setMaxListeners() to increase limit (node:400952) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 drain listeners added to [TLSSocket]. Use emitter.setMaxListeners() to increase limit (node:400952) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 drain listeners added to [TLSSocket]. Use emitter.setMaxListeners() to increase limit (node:400952) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 drain listeners added to [TLSSocket]. Use emitter.setMaxListeners() to increase limit (node:400952) MaxListenersExceededWarning: Possible EventEmitter memory leak detected. 11 drain listeners added to [TLSSocket]. Use emitter.setMaxListeners() to increase limit npm WARN deprecated minimatch@2.0.10: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue npm WARN deprecated minimatch@0.2.14: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue npm WARN deprecated graceful-fs@1.2.3: please upgrade to graceful-fs 4 for compatibility with current and future versions of Node.js npm WARN deprecated natives@1.1.6: This module relies on Node.js's internals and will break at some point. Do not use it, and update to graceful-fs@4.x.

> semantic-ui@2.4.2 install D:\_\_Dev\test\node_modules\semantic-ui > gulp install

fs.js:27 const { Math, Object } = primordials; ^

ReferenceError: primordials is not defined at fs.js:27:26 at req_ (D:\_\_Dev\test\node_modules\natives\index.js:143:24) at Object.req [as require] (D:\_\_Dev\test\node_modules\natives\index.js:55:10) at Object.<anonymous> (D:\_\_Dev\test\node_modules\graceful-fs\fs.js:1:37) at Module._compile (internal/modules/cjs/loader.js:936:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:947:10) at Module.load (internal/modules/cjs/loader.js:790:32) at Function.Module._load (internal/modules/cjs/loader.js:703:12) at Module.require (internal/modules/cjs/loader.js:830:19) at require (internal/modules/cjs/helpers.js:68:18) npm WARN rollback Rolling back for-own@0.1.5 failed (this is probably harmless): EPERM: operation not permitted, lstat 'D:\_\_Dev\test\node_modules\object.omit\node_modules' npm WARN rollback Rolling back globby@2.1.0 failed (this is probably harmless): EPERM: operation not permitted, lstat 'D:\_\_Dev\test\node_modules\rework-import\node_modules' npm WARN rollback Rolling back readable-stream@2.3.6 failed (this is probably harmless): EPERM: operation not permitted, lstat 'D:\_\_Dev\test\node_modules\replacestream\node_modules' npm WARN test@1.0.0 No repository field. npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! semantic-ui@2.4.2 install: 'gulp install' npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the semantic-ui@2.4.2 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\VI20079771\AppData\Roaming\npm-cache\_logs\2019-11-12T10_58_20_960Z-debug.log

WorldMaker commented 5 years ago

Apparently there is currently a known issue with Gulp 3 on certain versions of Node: https://stackoverflow.com/questions/55921442/how-to-fix-referenceerror-primordials-is-not-defined-in-node

This is breaking my CI builds right now (despite "autoInstall": true in semantic.json because the check for that is in the gulpfile), and just continues to underscore why running complex systems like gulp at install time is a chicken-and-egg dilemma with too many problems to solve and too many variables that can change. I feel like this issue is yet another reason Semantic should remove gulp from the npm install script, and move it to a manual process such as a semantic npx command (like things like create-react-app do), because the npm lifecycle is not where this should be happening, and it shouldn't be breaking CI so regularly.

jgomesmv commented 4 years ago

I'm also facing the same issue: image

prudho commented 4 years ago

You can either downgrade your node version or take a look at Fomantic UI which is an updated fork of Semantic-UI, working on node 12, and with a build system upgraded to Gulp 4 (and looooot of bug fixes and new features...).

WorldMaker commented 4 years ago

Since I was already using LESS in my webpack build anyway, I switched to fomantic-ui-less and moved the build process "in house" with the rest of my build and entirely got rid of the gulp dependency. Getting the webpack aliases right for the build process was the most tedious part, given the complexities of Semantic/Fomantic's import structure, but there were several blog posts out there that helped.

I still recommend Semantic/Fomantic move the gulp process out of pre/post install entirely. At the very least the JSON file check to skip the gulp build should be moved into a JS script file without dependencies, because gulp is huge and hard to install right and these sort of issues will continue to happen.