I am trying to copy entire directories as part of a Yeoman generator. I have multiple functions that call this.fs.copy and it works as expected (for the most part) except fonts and assetsdev. I cannot figure out why assetsdev task copies the source folder into the fonts directory rather than into the root where I have specified. Here are my three functions that wholesale copy a directory:
this.props.dotDest = './';
this.props.srcPath = './assets-dev';
this.props.destPath = './public/assets';
dotfiles: function () { // Works as expected. Copies to the root.
this.fs.copy(
this.templatePath('dot_files/.*'),
this.destinationRoot(this.props.dotDest)
);
},
fonts: function () { // Works as expected. Copies to the bootstrap directory.
var done = this.async();
this.log( chalk.magenta.bold('Copying /fonts') );
this.fs.copy(
this.templatePath('fonts'),
this.destinationRoot(this.props.destPath + '/fonts/bootstrap')
)
done();
},
assetsdev: function () { // Does NOT work. Copies to the Bootstrap directory rather than the root.
var done = this.async();
this.log( chalk.magenta.bold('Copy assets-dev') );
this.fs.copy(
this.templatePath('assets-dev'),
this.destinationRoot(this.props.srcPath)
);
done();
},
I expect the resulting folder structure to be
-assets-dev
-public
-assets
-fonts
-bootstrap
-fontfile
-fontfile
-fontfile
But instead it's generating...
-public
-assets
-fonts
-bootstrap
-assets-dev
-fontfile
-fontfile
-fontfile
...and I can't figure out why. I even tried using the async() method in case it was running asynchronously and happened to be in that directory when the assetsdev function runs.
Does anyone know why assetsdev is copying to the wrong folder? I hope I have explained clearly enough. Thank you in advance!
So apparently I cant use destinationRoot(). Instead I have to use destinationPath(). I am not sure why but using destinationPath() copies correctly now.
Related
I'm reading through electron and electron-builder docs, but I still do not quite understand what is the purpose of the buildResources folder?
Here's what a configuration doc for electron-builder says:
buildResources = build String - The path to build resources.
Kind of self-explanatory... But how or when they are involved in the build process, especially having that:
...build resources is not packed into the app. If you need to use some
files, e.g. as tray icon, please include required files explicitly
Can we simply put those icon files in an arbitrary folder and then copy over into the app/ manually (since we need to include buildResources manually anyway)?
TL;DR:
As far as I can tell from a quick glance at the source code, the buildResources folder is used to hold additional scripts, plugins, etc. that can be used by the package building software. Electron-builder doesn't generate the packages itself, it uses tools like NSIS.
Explanation:
I've had the same question and unfortunately find an answer for this isn't very straight-forward. The docs entry is pretty useless. I found out that someone asked about it in the GitHub issues but never got an answer.
I decided to dig in the code a bit myself to find out what it does. In NsisTargets.ts, you can see that the buildResources folder can contain custom includes and plugins for NSIS.
// NsisTargets.ts
taskManager.add(async () => {
const userPluginDir = path.join(packager.info.buildResourcesDir, pluginArch)
const stat = await statOrNull(userPluginDir)
if (stat != null && stat.isDirectory()) {
scriptGenerator.addPluginDir(pluginArch, userPluginDir)
}
})
// [...]
taskManager.add(async () => {
const customInclude = await packager.getResource(this.options.include, "installer.nsh")
if (customInclude != null) {
scriptGenerator.addIncludeDir(packager.info.buildResourcesDir)
scriptGenerator.include(customInclude)
}
})
and in pkg.ts it's used to load additional scripts to the pkg builder:
// pkg.ts
if (options.scripts != null) {
args.push("--scripts", path.resolve(this.packager.info.buildResourcesDir, options.scripts))
}
It appears as though buildResources can contain assets/scripts specifically used for the build process. That also explains why the contents of buildResources aren't included in the resulting app.asar file.
So, I'm going to say straight away that the documentation for this option is just awful.
Files included in buildResources will appear in the asar file which you can find documentation about on electron's website.
The option files will include files such as pictures which are not accessible in the asar file.
I.E.
given I have a folder called assets in my build folder I want to include with my app.
"files": [
"./build/**/*"
],
"directories": {
"buildResources": "assets"
}
This will put all folders inside build into the asar file, which you can then unpack by including,
"asarUnpack": "**/assets/*"
This will put the folder assets into the build folder in the app directory.
I have created a theme for Firefox that involve a simple stylesheet. I am currently using Stylish extension for this but would like to share my theme as an Firefox addon (since Theme are simple image).
I didn't quickly find anything about that in search engine and only find an outdated ressource on MDN.
Any tip to make share this CSS as an addon? (bonus: automate release from a git repo)
If it's a simple stylesheet as you described, then you would have to attach the stylesheet to the nsIDOMWindow. Example code with addon-sdk
const { attachTo, detachFrom } = require("sdk/content/mod");
const { Style } = require("sdk/stylesheet/style");
const { getMostRecentWindow } = require("sdk/window/utils");
const { browserWindows } = require("sdk/windows");
const { viewFor } = require("sdk/view/core");
const style = Style({
uri: "./index.css" // path to file
});
attachTo(style, getMostRecentWindow());
browserWindows.on("open", function(window) {
attachTo(style,viewFor(window));
});
require("sdk/system/unload").when(function() {
for (let window of browserWindows)
detachFrom(style, viewFor(window));
});
EDIT:
To start using addon-sdk you must have jpm. Here it is described how to install it. Once you installed it, you should create a directory that will contain your extension. Then open a terminal/console and type jpm init. Fill the prompted fields according to your needs. You can also check out these additional options available in the package.json (it's in the root of your directory with the extension) and use them aswell.
The next step is to paste my code in the index.js (you can paste the code somewhere else but then you have to import that file using require). Create a directory "data" in the extension directory and create a file with stylesheet there. Then replace "index.css" here
uri: "./index.css"
with your file name.
Once you are done, type jpm xpi in your terminal/console and your extension is ready to install! Good luck
I have this case. I need to grep a file for some RegEx and the result string (or array of strings) I need to save to variable for later use. And this has to be achieved using Gulp.
It should look like this in my idea:
var line;
gulp.task('grep', function(callback) {
line = someCoolSyncFunction('/needle/', './haystack.txt');
callback();
});
gulp.task('useIt', ['grep'], function() {
console.log(line);
});
Important is this someCoolSyncFunction to be synchronous and to handle file on physical/virtual file system, not the Vinyl file.
Is there a way to do this using Gulp? Or any other approach to achieve similar effect?
PS: to explain the reason, I need to extract version number from Debian package changelog and insert it to configuration file inside the package during the build process.
Thanks a lot.
Vit
I am doing some unit test in casperjs and I got stuck: how do include dependency file from the test itself? Included javascript file can be just a bunch of functions, and does not declare any interface (module.exports = ... etc).
I know I can include from the command line
$ casperjs test --include=./my-mock.js mytest.js
but how can I include files from the test itself?
Putting following on the top does not work for me... my_mock is undefined
casper.options.clientScripts = ["./my-mock.js"]; //push() does not help either
//mytest.js is below
// ------------------------------------------
casper.test.begin('ajax mock test', function suite(test) {
my_mock.setFetchedData("bla");
my_mock.doRequest();
test.assertEquals( ......);
test.done();
});
// ------------------------------------------
CasperJS version 1.1.0-DEV using phantomjs version 1.9.1
Using phantom.injectJs method is the best option I've found so far. E.g. you're having two files in your directory: "tests.js" and "settings.js". You want to include "settings.js" into "test.js". The first thing you should do with your "test.js" is write the following:
phantom.injectJs('settings.js');
casper.test.begin(...
...
The reason that clientScripts isn't working is that it is loaded on each page load, so you don't have access to the objects/functions defined in the file outside of a casper.evaluate() call.
You can use require() to pull in modules, however you may need to modify your included script to work with this method.
Here is what I changed your mytest.js to:
var my_mock = require('my-mock');
casper.test.begin('ajax mock test', function suite(test) {
my_mock.setFetchedData("bla");
my_mock.doRequest();
//test.assertEquals( ... );
test.done();
});
And this is a quick script (my-mock.js) that I threw together to print out when you use the functions you provided.
module.exports = {
setFetchedData: function(a) {
console.log('setFetchedData: ' + a);
},
doRequest: function() {
console.log('doRequest');
}
};
I found useful this sample demonstrating --includes option:
$ casperjs test tests/ --pre=pre.js --includes=inc.js --post=post.js
to load functions that you often use in your tests.
I'm building a generator that in part includes scaffolding from another project created with exec. Depending on user input I need to move or delete parts of this scaffolding.
Right now I'm doing it with node's fs.child_process.spawn and shelljs, but seeing as the Yo generator has mkdir, write, template, and copy, I'm wondering if there's a Yo way to move or delete files and directories.
I just use rimraf like this:
MyGenerator.prototype.removeDir = function removeDir () {
var cb = this.async(),
self = this;
rimraf('path/to/dir', function () {
self.log.info('Removing dir');
cb();
});
};
Remember to add rimraf as a dependency in your package.json file. Not sure if there's a built-in function for this but this one's been working fine for me so far.
Yeoman now supports this via the fs API, which is an in memory filesystem implementation.
this.fs.move('source/file', 'dest/file');
this.fs.copy('source', 'dest');
File System Docs
Still not documented, but this is the delete method (works for me):
this.fs.delete('file/to/delete');
Link: Yeoman issue 1505