Copying files with component build process isn't working

Question

I'm using component and component build to manage and build my frontend dependencies. I have a node script, taken from the examples, that builds all my components. But it isn't copying my files. This is the offending part (full code included below):

build.files(tree)
  .use('files', build.plugins.copy())
  .use('fonts', build.plugins.copy())
  .use('images', build.plugins.copy())
  .end();

I think it's not working because there is no fs.writeFileSync() call anywhere in the example, but I'm not sure if it needs that. According to the examples it should copy the files listed in my component.json, which looks like this:

{
  "name": "component"
  "images": [
    "logo.jpg"
  ]
}

But it isn't copying my images to the build folder (I believe there aren't any mistakes in the component.jsons or the components themselves, I suspect it is something with the build code). This is the full script:

/**
 * =============================================================================
 * Builder (https://github.com/component/builder2.js)
 * =============================================================================
 */

var fs = require('fs');
var resolve = require('component-resolver');
var build = require('component-builder');
var mkdirp = require('mkdirp');

var argv = require('minimist')(process.argv.slice(2), {boolean: true}); // parse argument options
var src = process.cwd() + '/' + argv.src;
var dest = process.cwd() + '/' + argv.dest;
var components = process.cwd() + '/' + argv.components;
var buildname = argv.buildname;
var dev = argv.dev || false;

// resolve the dependency tree
resolve(src, {
  install: true, // install the remote components locally
  development: dev, // whether to include development components
  out: components // folder to install components to
}, function (err, tree) {
  if (err) throw err;

  // create 'dest' path
  mkdirp(dest, function (err) {
    if (err) throw err;
  });

  // build `.js` files from components' `.scripts` field
  build.scripts(tree)
    .use('scripts', build.plugins.js())
    .end(function (err, string) {
      if (err) throw err;
      fs.writeFileSync(dest + '/' + buildname + '.js', string);
    });

  // build `.css` files from components' `.styles` field
  build.styles(tree)
    .use('styles', build.plugins.css())
    .end(function (err, string) {
      if (err) throw err;
      fs.writeFileSync(dest + '/' + buildname + '.css', string);
    });

  // copy other files to the build folder
  build.files(tree)
    .use('files', build.plugins.copy())
    .use('fonts', build.plugins.copy())
    .use('images', build.plugins.copy())
    .end(); // callback optional
})

score 0 · Accepted Answer · 2014-07-31T12:34:02.083

To anyone with the same problem: the .copy() plugin builds to the build folder by default (which I didn't notice, because I was building my css and js to another folder). To have the .copy() plugin build to a different folder pass it a different destination like so:

var dest = 'name-of-folder-or-complete-path';

// copy other files
build.files(tree, {destination: dest})
  .use('files', build.plugins.copy())
  .use('fonts', build.plugins.copy())
  .use('images', build.plugins.copy())
  .end(); // callback optional

Copying files with component build process isn't working

1 Answers1