I have cloned a client's Wordpress repository from Github, however - I am struggling to get it up and running properly.
There is a basic Wordpress setup but the site uses Gulp, by means of a gulpfile.js in the theme directory. This keeps the site minified and builds a 'dist' folder which includes the css and js.
I have all the site files an the theme setup and connected to the database and its all working besides the missing 'dist' folder.
If i dont have node, npm or gulp on my system - do i install them in that order in the theme folder, the root wp folder - or do i not even need to install them? I've tried installing those in the theme folder then running 'gulp' in terminal - but that just tells me i have a bad command.
What do i need to do to execute and run the gulpfile.js is bbasically my question - thank you!
Install Node and NPM Installing npm from the Node.js site
Go where the package.js is and in a terminal run:
npm install
Then you should be able to run
gulp
If this does not work you should look into the gulp file (gulpfile.js) the name of the task and run it accordingly, probably will be something like
gulp build
eg. for a gulp file with this sass task you will run like so:
/**
* Compile Sass.
*/
gulp.task('sass', function() {
return gulp.src('./sass/*.scss') // Create a stream in the directory where our Sass files are located.
.pipe(sass()) // Compile Sass into style.css.
.pipe(gulp.dest('./')); // Write style.css to the project's root directory.
});
gulp sass
if none works post the gulp file or more info so we can help you better, good luck.
Related
I am new to using Node.js
I have a project folder structure C:\A\B\C\
I have C:\A\B\C\html_pages\index.html in which I have React.js code having CDN
and C:\A\B\C\server.js which has Express.js code which I want to run.
I installed nvm then installed Node.js using command
nvm install 4.5
In windows PowerShell, I went to project directory
C:\A\B\C and used npm init (node_modules were not created in this step)
Did npm install express --save to use the express module (now node_modules folder was created but package.json was inside express folder)
Used npm start to start the web server but it gave following error.
ENOENT: no such file or directory, open 'C:\A\B\C\package.json'
I checked the posts on Stackoverflow for this error but was not able to solve it.
Should the package.json be generated directly under 'C:\A\B\C\ ?
I have installed Node.js in C:\Program Files\nodejs while project is not under Program Files, is this related to this?
P.S. : Used npm init --yes so that it installs node_modules inside my project folder and got the request processed but port 3000 gives error that it did not get GET request
The package.json file should be on the root of your directory.
Open command line from your root directory and type,
npm init
This will generate a package.json file on that directory.
Currently, if you are using a package.json file to manage your project's dependencies (whatever project it is, may it be a ruby, php, python or js app), by default everything is installed under ./node_modules.
When some dependencies have binaries to save, they're installed under ./node_modules/.bin.
What I need is a feature that allow me to change the ./node_modules/.bin directory for ./bin.
Simple example:
A PHP/Symfony app has a ./vendor dir for Composer dependencies, and all binaries are saved in ./bin, thanks to the config: { bin-dir: bin } option in composer.json.
But if I want to use Gulp to manage my assets, I create a package.json file, require all my dependencies and then run npm install.
Then, my wish is to run bin/gulp to execute gulp, but actually I have to run node_modules/.bin/gulp which is not as friendly as bin/gulp.
I've looked at package.json examples/guides on browsenpm.org and docs.npmjs.com, but none of them works, because they are here to define your own project's binaries. But I don't have any binaries, because I want to use binaries from other libraries.
Is there an option for that with NodeJS/NPM ?
You might consider adding gulp tasks to your package.json.
// package.json
{
"scripts": {
"build-templates": "gulp build-templates",
"minify-js": "gulp minify-js"
}
}
You can run any scripts specified in package.json by simply running the following:
$ npm run build-templates
$ npm run minify-js
You get the idea. You can use the gulp command inside the string without doing ./node_modules/.bin/gulp because npm is smart enough to put all scripts from ./node_modules/.bin/ into the path for that script execution.
I am trying to use the tool grunt2gulp.js to migrate multiple projects that were set up with grunt into gulp. However, I am unsure how to proceed.
The tool grunt2gulp.js seems to be a simple way to start, but the problem I am having is that I cannot get it to work. As there is no npm install -g grunt2gulp, I am somewhat unsure what I need to do to install the project globally and be able to access it.
The readme.md on the github repo doesn't specify how to install the project.
Download the grunt2gulp.js file to the same directory as your Gruntfile.js file. Navigate to that path using terminal and paste this command:
node grunt2gulp.js Gruntfile.js > gulpfile.js
This will create a gulpfile.js file in the same directory.
It's been a long time I dident generate the docs (since 0.19.3 ), and it seems that the doc was separated.
I dont know how to generate the docs, because it is not well explained:
Before running server you will need to build your UI files for the docs. Semantic UI includes a special command to build files for a docs instance that must be run from an adjacent Semantic UI folder. for example with a directory vendor -> SemanticUI place docs folder inside vendor to reflect vendor -> SemanticUI | docs
Can you please guide me how to do it?
From the Semantic UI source, i run npm install , it installed all what needed, and then when I run gulp build-docs it generated a docs folder which is outside the source, this one, if i run inside it the command docpad run, I dont get the right HTML, because I dont know where to put the Separated Docs downloaded.
Answered here
Just pick what you're missing to get it complete.
(It probably has some typos.)
A terminal is required.
Assumed folder structure:
path/to/your/bull polished/project
|
`_ docs
|
`_ learn
|
`_ ui
N.B.
All 3 subfolders docs, learn, ui may be given different names.
Subfolders docs and ui must be adjacent folders.
At the moment learnsemantic.com (learn) is independent of the other 2 repos. So it could be placed anywhere you like.
Clone the repos:
cd path/to/your/bull polished/project
docs:
git clone --recursive --progress -v "git#github.com:Semantic-Org/Semantic-UI-Docs.git" "docs"
Cloned https://github.com/Semantic-Org/Semantic-UI-Docs (http://semantic-ui.com/)
learn:
git clone --recursive --progress -v "git#github.com:Semantic-Org/Learn-Semantic.git" "learn"
Cloned https://github.com/Semantic-Org/Learn-Semantic (http://learnsemantic.com/)
ui:
git clone --recursive --progress -v "git#github.com:Semantic-Org/Semantic-UI.git" "ui"
Cloned https://github.com/Semantic-Org/Semantic-UI (The Semantic UI framework)
N.B.
When you don't want to clone all the SUI repo history, read this : #220 (comment)
Install Gulp globally AND locally.
npm install -g gulp
cd "path/to/your/bull polished/project/ui"
npm install gulp
Install the Semantic UI framework.
(Still in : "path/to/your/bull polished/project/ui")
npm install
gulp
OR:
gulp install
Install Docpad globally AND locally. Install Docpad plugins locally.
Install globally:
npm install -g docpad
Note: To update globally docpad upgrade
Then install locally into docs:
cd "path/to/your/bull polished/project/docs"
npm install docpad
docpad install eco
Then install locally into learn:
cd "path/to/your/bull polished/project/learn"
npm install docpad
docpad install eco
Note: To update locally (docpad and plugins) run: docpad update inside the docs and learn folders.
NB
docpad update purges/obliterates the docs/out folder (which was filled with dist and src folders, and files by gulp build-docs, gulp-serve-docs, and docpad run)
So when the time comes, run docpad update before building the Docs from the ui folder.
Run npm install docpad as root/Administrator (to avoid permission issues).
Definitely on Windows.
Sometimes also on Linux/OS X, if Node was installed "incorrectly".
But at least on Linux/OS X you can reinstall Node to correct this.
See: node-forward/help#4
Build the Semantic UI framework:
cd "path/to/your/bull polished/project/ui"
Only if required:
gulp clean
Followed by:
gulp build OR gulp watch
Build the Semantic UI framework for the Documentation in the docs folder:
cd "path/to/your/bull polished/project/ui"
gulp build-docs OR gulp serve-docs
gulp build-docs : Creates and fills docs/out/dist and docs/out/src
gulp serve-docs : Watches for source file changes in the ui folder and updates folders docs/out/dist and docs/out/src.
Generate the Semantic UI Documentation pages and start the local server:
cd "path/to/your/bull polished/project/docs"
docpad run
docpad run : Creates all documentation files and folders (other than docs/out/dist and docs/out/src) in the docs/out folder.
Generate the learnsemantic.com pages and start the local server:
cd "path/to/your/bull polished/project/learn"
docpad run
docpad run : Creates all documentation files and folders in the learn/out folder.
When you're changing the SUI framework variables, etc
1) Make your changes to the framework.
2) Rebuild the framework:
gulp clean (only when necessary)
gulp build OR gulp watch
3) Update the docs:
gulp build-docs OR gulp serve-docs
4) Generate the documentation pages.
docpad run OR docpad server
Go back to 1)
If you used gulp watch and gulp serve-docs you should be fully automatic.
I've encountered a weird issue when installing Gulp in a new project.
Let's say I have the following path:
c:/development/myproject
When I run npm install gulp in that directory, the node_modules folder actually gets created in
c:/development/node_modules
instead of
c:/development/myproject/node_modules
And all of gulp plugins also get installed in that directory outside my project root.
I also have an earlier project where gulp was already installed before, and when I tried to rerun gulp installation in that project directory it was installed correctly in the project root (for example: c:/development/myolderproject/node_modules), not outside.
I don't think it has anything to do with the case, but the new project is using Laravel 4, while the other one is on Laravel 5.
I don't recall having to set any specific configuration before, so I'm totally confused why it behaves differently.
When you did npm install it found package.json from parent directory and thought it was the package root.
Related docs: https://www.npmjs.org/doc/files/npm-folders.html#more-information
Starting at the $PWD, npm will walk up the folder tree checking for a folder that contains either a package.json file, or a node_modules folder. If such a thing is found, then that is treated as the effective "current directory" for the purpose of running npm commands. (This behavior is inspired by and similar to git's .git-folder seeking logic when running git commands in a working dir.)
If no package root is found, then the current folder is used.
I run Ubuntu 15 and I had a similar issue where gulp was installing the node_module folder somewhere I couldn't find. gulp would say ../../node_modules was the location but it was NOT in my project folder.
I figured out from the link above and some more research I just needed to run npm init to create a project.json in my project folder. gulp was installing the node_modules in another folder because it searches for a project.json file to install the folder node_modules into.
Hope this helps anyone else solve this silly problem.