Semantic-ui: Installing through yarn freezes

[bobvanderlinden]

When installing Semantic-UI using yarn, yarn gets stuck when it runs the install script of Semantic. It does not matter whether the "autoInstall": true is set in semantic.json, so it doesn't seem to be a problem with the interactive CLI itself.

When yarn is called using --ignore-scripts it finishes the installation without problems.

This is probably a problem with yarn itself and an issue has been made on the issue tracker of yarn that can be found here, but for completeness I thought to create one here as well.

[daaain]

As a workaround it seems after aborting the failed attempt and one more try with Yarn with apparent success, if then you run npm install semantic-ui --saveDev and go through the installation "all is fine"? As in, you get all the Semantic UI stuff created and a valid yarn.lock.

[cowwoc]

Have any of the developers had a chance to take a look? It's important to establish whether the bug lies in yarn or semantic ui or else this bug will never get looked at.

[jlukic]

I'm aware of the issue, but I dont know any simple way to go about debugging. If someone has any advice for changes I'll be happy to make.

[ricardovf]

@daaain it works if i run twice, but i can not do that in the build process of the deploy... So we need a real fix.

[daaain]

@ricardovf for sure we need a proper solution, mine is a very ugly workaround with God knows what sorts of unpredictable side effects...

[just-boris]

@bestander, one of Yarn team members, has commented the related Yarn issue:

At this moment the core team is not focusing on fixing this issue because we believe that dependencies should be able to be installed automatically and in parallel mode.
When a dependency is trying to steal stdin even in a non TTY mode this seems to me an antipattern.

In other words, Yarn do not allow you to stop installation process and make dialog with user. It means, that this project itself should reconsider this behavior, for example, disable dialogs if installation is not run from NPM CLI.

[michgeek]

Any chances to get https://github.com/scampersand/Semantic-UI/commit/fe795f5c6dd6592746f271c3f0f68fa39f0a6c4d to the official repo?

[gsahni]

Still facing this issue, please let us know the ETA when this change is going to be part of release?

[michgeek]

Half a Solution:

I have found that if you use semantic.json and have autoInstall: false it will skip the interactive CLI and won't freeze your build!

The condition for it to work is to have semantic-ui already installed at the location given at "base"

[bensaufley]

The above solution of "autoInstall": false does not seem to work for me. "autoInstall": true auto-installs rather than prompting (and thus is able to complete), but it doesn't respect the other settings in semantic.json (see #5287)

[michgeek]

@bensaufley Just find out that it worked for me because my semantic-ui was already installed at the location given at base. If I delete my local installation it wouldn't work. :(

[bensaufley]

In the end I ran npm install --save semantic-ui, which ran the install script, and then yarn install which baked the versions into yarn.lock and gulp install was quietly circumvented because it considered Semantic UI had already been installed. Kind of clunky but I think it did the trick?

[ZoeDreams]

i ran into this issue too. fell back to npm install which works as deigned

[AdamBCo]

I'm currently running into this issue. Are there any updates?

[seanconnollydev]

Is there a reason why the gulp install needs to run on npm install? It seems to me the intent of the interactive CLI is meant for a dev who is bootstrapping semantic into their project but install runs in other contexts too. Why not change this in package.json:

  "scripts": {
    "install": "gulp install"
  },

to

  "scripts": {
    "bootstrap": "gulp install"
  },

Then the "Get Started" instructions would be:

npm install --save semantic-ui
npm run bootstrap

The current setup is really quite broken in a few basic npm scenarios. My present headache is an attempt to use semantic-ui inside my own theme package:

/theme
  /semantic
    /src
    /tasks
  package.json
  semantic.json

My app declares theme as a dependency in its package.json. Since theme depends on semantic-ui, when I attempt to install the app, the folder structure is going to look like this:

/app
  /node_modules
    /semantic-ui
    /theme
      semantic.json

Because npm flattens dependencies.

And now the folder structure doesn't work. My semantic.json file is useless and can't even be used to configure autoInstall.

[ghost]

There is a nice, easy fix for this:

> yarn add semantic-ui --ignore-scripts
> cd ./node_modules/semantic-ui/
> gulp install

Finally, the semantic installation instructions say that after installing semantic, we must navigate to <project_root>/semantic/ and run gulp build

[choliver]

That's only a workaround in the loosest sense - it requires a bunch of weird special-case orchestration that you'd need to add to your CI build, for example.

[jfarlow]

Any update on this?

Semantic and Yarn still don't play well together.

There seems to be some overlap with this bug as well when using LESS:
https://github.com/Semantic-Org/Semantic-UI/issues/5821

And between the unfound files, the incompatible install scripts, and the difficulty in debugging the yarn process, this is getting challenging to work with.

[robclancy]

Man I wish I could remove semantic-ui. Everytime I come back to our legacy project the only issues we have is with this poorly supported framework. Something as basic as installing it doesn't work.

[hammy2899]

@robclancy Try using Fomantic-UI we are supporting SUI as a community fork and we will help with any support you need + we have fixed a load of issues with the framework 😉

[robclancy]

@hammy2899 will give it a look, thanks