I am completely new to metalsmith. I've been following this tutorial: http://www.robinthrift.com/post/metalsmith-part-1-setting-up-the-forge/
I want to build my site to the root directory of my project (the same dir as the build script). I want to do this because I want github pages to play nicely with it. But when I try to build, I get this error: Error: EBUSY, resource busy or locked
Here is my dir structure:
project_folder/
_site-src/
index.html
node_modules
build.js
package.json
Here is my build.js source:
var Metalsmith = require("metalsmith");
Metalsmith(__dirname)
.source("_site_src")
.destination(".")
.build();
What I want my project dir to look like:
project_folder/
_site-src/
index.html
node_modules
build.js
package.json
index.html
I don't know what I'm doing wrong. I appreciate any help.
The error message:
Error: EBUSY, resource busy or locked
seems to be a file locked/in use error. (I'm not that familiar with Node.js errors)
I would assume this is happening when Metalsmith tries to clean the build folder (which is your solution folder i.e. a really bad idea). This is on by default but it can be turned off.
To turn this off use:
.clean(false)
before you build.
BUT if you remove items from your source folder they won't be removed from your build folder. You might be able to handle this by a custom clean-up script or plugin.
I'm not experienced with github pages but I think there should be a better alternative to the avoid the problem.
You could possibly add a symbolic link to the build folder from the project folder for the index.html file.
Related
I need the following folder structure:
public
index.html
build
main.js
other.js
I have created simple demo, here is a link to github, so you can check the configs:
https://github.com/ArtemDomochka/dev-server
Problem: dev-server doesn't work
Details: If I will build the project with npm run build everything is good. But whenever I start dev-server with npm run start it doesn't work. May be dev-server changes file structure, but in browser I just get error: Cannot GET /, so it can't even find index.html
Is it possible to fix it?
There is also an interesting observation: If I will build project and then serve it, page will be loaded correctly, but it will not handle code changes in real time
I was recently working on a Vue.js project and I am done with the "Beta-Version". I want to deploy my website to an online server and share it with the world. I used npm run build to generate the scripts in the dist folder, and now I want to upload the files to the server, but I doubt that all the files are necessary to be uploaded. I guess I should remove some files that don't effect the user experience.
The Question: What are the files that can be removed before deploying a Vue.js project?
Note: I'm not talking only about the dist folder, I'm taking about removable files and folders in the root project directory, that contains dist and package.json and node_modules.
The purpose of build process is to put any and all files and nothing else necessary for deployment into a folder, in this case, dist folder.
Oops. This was meant to be a comment.
You really shouldn’t delete any file in dist folder unless you know for sure you don’t need it.
If you do know that certain file doesn’t belong, it shouldn’t be there to begin with.
But unless you modified build portion to add something you don’t need, it most likely doesn’t contain any that shouldn’t be there.
I have a JavaScript project that includes both frontend and backend codes (NodeJS). This is my production folder structure:
/prod
/server
sourceCode1.js
sourceCode2.js
...
sourceCodeN.js
index.js
/client
bundle.js
ReadMe.md
license.txt
When user hit my /server/index.js, I call express.static(__dirname + '/../client') to serve user js files in /client folder.
I have plenty of frontend js files under /client folder originally, but they are minified and combined into one bundle.js when they are moved to prod as you can see above. I want to add one single config file in JSON format that contains configuration for both my backend and frontend code. But I'm not sure where/how to place it. I think no matter where I put it, my code in /server/index.js can access it with no problem. But for /client/bundle.js, accessing the config file will require another request to the server which seems poor design to me...
Can anyone suggest a way that solves the problem better?
P.S.
I use gulp to minify and combine my frontend js files into bundle.js, I can put the config file in /client folder and use gulp to bundle it together with other js files as well. But that means every time I change the config file, I need to gulp everything again which doesn't make any sense.
PPS.
I agree pulp will work just fine for myself. Another reason I didn't want to use pulp to bundle the config file is that this is an open source project, I'm hoping when someone else uses it and he only wants to change one tiny setting in the config file, he doesn't have to go through the gulp step..
I can put the config file in /client folder and use gulp to bundle it together with other js files as well. But that means every time I change the config file, I need to gulp everything again which doesn't make any sense.
I think it does make sense. Other people do too.
If you're worried about speed, I recommend having two Gulp tasks: Dev and Build.
Dev should watch the source for changes and update the configuration.
Build should do slow things like bundling and minification as well as update the configuration.
I am working on an Angular project and wanted to host the project through GitHub with gh-pages.
Since the index.html file was not in the root directory, I created an empty branch off of my master and called it gh-pages. I then copied my files into the new branch, so that the index.html file was in the root directory.
I am also using Grunt, so I copied the grunt generated app.js file into the root directory as well. I can now see the project in the browser if I go to http://kelseysteele.github.io/votm3/#/home, however the navigation bar is missing and the other pages, like http://kelseysteele.github.io/votm3/#/overview, are not working properly.
I've been stuck on this for a few days and would really appreciate any assistance with this.
Check your console, you'll see errors: GET http://kelseysteele.github.io/data/overview-data.json 404 (Not Found)
Fix the url here: https://github.com/KelseySteele/votm3/blob/master/src/votm3/Scripts/controllers/overview-controller.js#L10
Because you are using grunt, you will want to build the project before serving the files. This will make the files and code modules build properly before serving the index.html. A popular module you can use is https://github.com/tschaub/grunt-gh-pages an get your builds serving properly.
I'm using generator-backbone for Yeoman to generate my app. I'm using the RequireJS option for this. After generating, I can run grunt serve correctly. After adding some views and tempaltes, and successfully running grunt serve, I try to test the "dist" folder. I run grunt build, which works correctly, but when running the app from the dist folder I get several errors regarding some of the views files not loading, with require js.
I get 404 not found for these files and then an Script Error for RequireJS.
Is there something that needs to be added in the included Gruntfile so that the JS files for views are included in the process?
Thanks for your help!
UPDATE: This is my Gruntfile, generated by generator-backbone:
http://codeshare.io/gjDWA
SUMMARY:
grunt serve works fine.
grunt build runs fine
grunt serve:dist or running the app frm the dist folder doesn;t work. Blank page with these errors:
http://screencloud.net/v/6O91
In case anybody else encounters this issue, the problem is related to a property:
findNestedDependencies: true in the optimization configuration.
Cheers!