Semantic-ui: Running gulp in project folder, it looks for semantic.json in wrong path

[miniskulljob]

Hi.

Let's assume we have Semantic-UI installed in C:\projects\node_modules\semantic-ui and we specified during install that our project folder is in C:\projects\brand\web and everything else default.
Then, we navigate to the semantic folder in our project and run gulp build like the installation suggests. It will throw an error like this:

Building Semantic
Cannot build files. Run "gulp install" to set-up Semantic

Trying to figure out the problem, I tried moving the semantic.json to the C:\projects folder, and it worked. So, my guess is that when we run gulp, it looks for its installation path, and then it starts from there, assuming its relative path is the installation path, so it looks for the semantic.json in the wrong place.
The only working solution I found, without moving the semantic.json file out of the project folder, is copying the gulp installation to a node_modules folder inside the project folder.

[jlukic]

Hi, it'll continue climbing up looking for semantic.json and then use the paths relative to that location.

So if you move the file up one level you'll need to adjust the paths in the file to include the additional directory.

If you're sure this is still not the cause, feel free to include your folder paths and the semantic.json in a gist and i'll see if i can reproduce.

[miniskulljob]

Nope, that's the problem: It won't use the semantic.json path, it uses the gulp installation path.

C:\projects\node_modules\                   // Semantic-UI, gulp and other dependencies install path
C:\projects\brand\web\                         // Project path specified during install
C:\projects\brand\web\semantic.json   // JSON file generated during install
C:\projects\brand\web\semantic\          // Semantic-UI folder created during install

If we run gulp build in the semantic folder:

C:\projects\brand\web\semantic\gulp build

Building Semantic
Cannot build files. Run "gulp install" to set-up Semantic

It fails because it's taking C:\projects\node_modules\ as the starting path and climbing up from there, and I know it is like that because if I put the semantic.json in C:\projects\, it works.

[rudyryk]

Have the same issue, just performed fresh install via npm install semantic-ui. And I have got gulp installed globally with npm install -g gulp.

[dattanchu]

This issue exists in semantic 2.0 release. The search is not done from the current project folder (where the gulpfile.js is) but from the node prefix folder.

[jlukic]

Are you using NPM3 pre-release? They plan on removing peer dependencies, and I haven't tested with this yet.

In NPM2 you should get them correctly in your project folder via peer dependencies.

[dattanchu]

I am using npm 2.12.0. Here is what I did

I am in directory /home/dchu/foo/bar

npm install semantic-ui --save
Choose Express, my project directory is /home/dchu/foo/bar/web

Now I have semantic.json in /home/dchu/foo/bar and a folder semantic (with gulpfile.js) in /home/dchu/foo/bar/web

cd /home/dchu/foo/bar/web/semantic/
gulp build

Starting 'build'...
Building Semantic
Cannot find semantic.json. Run "gulp install" to set-up Semantic

[jlukic]

If /home/dchu/foo/bar/web/semantic.json exists (which I'm assuming it does?) this is most likely a bug in require-dot-file.

In that case, could you do me a favor?

open node_modules/require-dot-file/index.js
and above line 22 add

console.log(currentPath)

This should output all the paths it checks for semantic.json before failing

[dattanchu]

Yes /home/dchu/foo/bar/web/semantic.json exists.

I wiped my node_modules folders and reinstall semantic-ui from npm. This time it works as per the doc. :| I am not sure what in my config was screwing things up before. Thank you for the help.

[jlukic]

I'm sorry about this. This is something I'd like to make easier for people. Let me know if you encounter any more problems.

[gaborluk]

This issue occurs when there is a node_modules folder upstream in the directory tree during installation.

For example, if you're trying to npm install semantic-ui --save in C:\Users\ApertureScience\Desktop\SemanticUITest but happen to have an existing node_modules folder under C:\Users\ApertureScience, then the install wizard will first ask...

Is this your project folder?
C:\Users\ApertureScience

...and then if you say no and specify the absolute path C:\Users\ApertureScience\Desktop\SemanticUITest instead, the installer will install Semantic UI in that folder, but will not create a node_modules there.

If you then try gulp build in C:\Users\ApertureScience\Desktop\SemanticUITest\semantic, you get the above error.

Hope this helps, @jlukic.

[friberaf]

@gaborluk That worked for me.
Just had to move the node_modules folder to the ../Project/Semantic folder and run gulp build again.

Thanks!

[gaborluk]

@friberaf, thank you for the feedback, happy to help!

[kluner]

@gaborluk : same solution fixes my issue on Mac OS X. Thanks a lot! :) There was indeed a nod_modules directory 5 layers down from where I was trying to install.

[jlukic]

If anyone knows another way to find where an npm install cmd was run from an install script, I'd be game to swap out. This is how it's currently determined

[guido4000]

Why do you close? There is no proper solution yet.

[fholzer]

Hi, since Gulp v3.8.1 there's process.env.INIT_CWD which is the original cwd [the CLI] was launched from.

@gaborluk during the npm install semantic-ui this won't help, and you'll need to specify your project path manually, BUT when running gulp build, while process.cwd is C:\Users\ApertureScience\node_modules, process.env.INIT_CWD is set to the path you ran gulp build from. In your case that would be C:\Users\ApertureScience\Desktop\SemanticUITest\semantic.

So now the question for @jlukic is where to put this...
Options:

1. All calls to requireDotFile('semantic.json') would need as second argument process.env.INIT_CWD
2. Change require-dot-file to default to process.env.INIT_CWD instead of path.join(__dirname, path.sep , '..'), which is a breaking change.
3. Maybe have require-dot-file run both methods. Currently implemented one being default, with INIT_CWD as fallback?
4. Something i didn't think of?

[fholzer]

BTW, during npm install, no matter in which sub directory you run it, initial CWD for the install script is always you node_modules directory, so that doesn't help at all for detecting your project directory and suggesting it during install phase.

[jlukic]

If you check install scripts getPackageManager will return the directory directly above node_modules. I had a bit of discussion on gitter about the install scripts and am fairly sure they need a slight revamp.

The majority of this work however will be figuring out a new way to handle dependencies now that peerDependencies are deprecated in NPM@3

[fholzer]

The initial CWD during install is only needed to suggest the correct project directory during install..

Though if the user provides his project path, then at least gulp build will work as expected with my suggested options. And that is the critical issue after all, so why wait for some npm change?

[afshinm]

Here is the solution: http://stackoverflow.com/a/31881263/375966

[miniskulljob]

@afshinm That's what I've doing until now, but it implies copying 13,000+ files for every project you're working on. It's ridiculous. Thirteen thousand files for each project. Why can't gulp, and all its dependencies, be installed and used globally?

[stefanbuttigieg]

Above-mentioned solution worked for me. I'm trying to create a recipe for an easy way to setup a project for entry-level web devs but somehow this seems to complicate matters especially when setting up the workspace. Any solution for this?

[jackjwilliams]

I can't believe this is still an issue .... no fixes other than copying the ENTIRE node_modules to the folder or modifying .js files?

[anithegregorian]

Faced the same problem. I was able to solve this problem by moving semantic.json file into my global /usr/lib/node_modules folder and that worked!

[jackjwilliams]

See #3514 for the solution, I think it's been merged but it may not be in npm repo yet.

[ghost]

Hi, on install in ~/Sites/project

npm install semantic-ui --save
npm WARN deprecated [email protected]: Please use gulp-clean-css
npm WARN excluding symbolic link tests/withsymlinks/.hidden -> ../shown/.hidden
npm WARN excluding symbolic link tests/withsymlinks/bar.txt -> ../shown/bar.txt
npm WARN deprecated [email protected]: graceful-fs version 3 and before will fail on newer node releases. Please update to graceful-fs@^4.0.0 as soon as possible.
npm WARN deprecated [email protected]: lodash@<3.0.0 is no longer maintained. Upgrade to lodash@^4.0.0.
npm WARN deprecated [email protected]: graceful-fs version 3 and before will fail on newer node releases. Please update to graceful-fs@^4.0.0 as soon as possible.
npm WARN deprecated [email protected]: lodash@<3.0.0 is no longer maintained. Upgrade to lodash@^4.0.0.
npm WARN saveError ENOENT: no such file or directory, open '/Users/fmachine/package.json'
npm WARN enoent ENOENT: no such file or directory, open '/Users/fmachine/package.json'
npm WARN fmachine No description
npm WARN fmachine No repository field.
npm WARN fmachine No README data
npm WARN fmachine No license field.

/Users/fmachine/Sites/project > cd semantic/
/Users/fmachine/Sites/project/semantic > gulp build
// adding console.log(currentPath)

/Users/fmachine/node_modules/semantic.json
/Users/fmachine/semantic.json
/Users/semantic.json
/semantic.json
/Users/fmachine/node_modules/semantic.json
/Users/fmachine/semantic.json
/Users/semantic.json
/semantic.json
[10:19:47] Using gulpfile ~/Sites/project/semantic/gulpfile.js
[10:19:47] Starting 'build'...
Building Semantic
/Users/fmachine/node_modules/semantic.json
/Users/fmachine/semantic.json
/Users/semantic.json
/semantic.json
Cannot find semantic.json. Run "gulp install" to set-up Semantic

/Users/fmachine/Sites/project/semantic > gulp install
/Users/fmachine/node_modules/semantic.json
/Users/fmachine/semantic.json
/Users/semantic.json
/semantic.json
/Users/fmachine/node_modules/semantic.json
/Users/fmachine/semantic.json
/Users/semantic.json
/semantic.json
[10:20:12] Using gulpfile ~/Sites/project/semantic/gulpfile.js
[10:20:12] Task 'install' is not in your gulpfile
[10:20:12] Please check the documentation for proper gulpfile formatting

moving ~/node_modules/semantic-ui to ~/Sites/project/node_modules and re-running gulp build seems to work...

[hmaesta]

2016 and I still can't install Semantic-UI without node_modules (_and it''s 10.689 files / 44 mb_) in the project folder.

We really can't do anything about it?
This thread should not be closed.

[ghost]

According to @fholzer, I just replace "return requireDotFile('semantic.json')"; by "return requireDotFile('semantic.json', process.env.INIT_CWD);" in semantic/tasks/config/project/install.js on line 34 and it works fine.

[lexus27]

I have problem with folder /dist after gulp build
I have /dist in project/node_modules/semantic-ui/dist after gulp build instead project/semantic/dist
What should I do?

[andreweugene]

Same problem. Have to copy the node_modules folder inside the project folder to work. Making a copy of node_modules per project is a waste of space!

[peinearydevelopment]

When I go into semantic\tasks\config\user.js and change line 31 from userConfig = requireDotFile('semantic.json'); to userConfig = requireDotFile('semantic.json', __dirname);, the build seems to traverse the parent directories properly and find the semantic.json file. I'm not familiar enough with the entire semantic gulp build system though to know if this is the correct fix. Can anyone else verify if it works for them as well?

I'd be happy to submit a pull request if this is indeed a fix.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 30 days if no further activity occurs. Thank you for your contributions.

[armellarcier]

? we need a fix on this too..

[jango07]

any appropriate solution to this other than copying the node_modules

[newfylox]

We need the small fix as suggested by peinearydevelopent for this. I just understood what happened after hours when trying to deploy my website with Capistrano. To save time when deploying my website, I created a symbolic link to a common node_modules folder but then again, it doesn't detect my semantic.json file because the script thinks it's in my common node_modules folder, not my project folder.

[peinearydevelopment]

We need the small fix as suggested for this. I just understood what happened after hours when trying to deploy my website with Capistrano. To save time when deploying my website, I created a symbolic link to a common node_modules folder but then again, it doesn't detect my semantic.json file because the script thinks it's in my common node_modules folder, not my project folder.

Here is how I solved the issue in case it helps anyone else. This has been an issue for years and doesn't seem to be a priority.

[newfylox]

So peinearydevelopment, the trick to change the line to userConfig = requireDotFile('semantic.json', __dirname); isn't enough? I like your blog by the way, well explained, but I thought there would be an easier way to solve this?

[peinearydevelopment]

So peinearydevelopment, the trick to change the line to userConfig = requireDotFile('semantic.json', __dirname); isn't enough? I like your blog by the way, well explained, but I thought there would be an easier way to solve this?

I agree, I wish there was an easier way. This was 2 years ago, so my memory is a bit fuzzy on it. I think userConfig = requireDotFile('semantic.json', __dirname); does fix it. I created a postinstall command though and the extra file, so that everyone on the team doesn't need to remember to do it when they pull down the project for the first time. Also, if your project is going to run on a build server, this will ensure that change happens there as well. All the best.

[lubber-de]

Fomantic-UI finally fixed this by https://github.com/fomantic/Fomantic-UI/pull/1467