These are chat archives for brunch/brunch

11th
Oct 2016
Bill Columbia
@billcolumbia
Oct 11 2016 00:43

I'm just trying to get started, but my main JS file is being registered in the output code like so: require.register("preprocess/js/app.js". That's full path to the file, not just a module name like the docs show.
This is my folder structure:

root/
  preprocess/
    css/
      app.scss
    js/
      app.js
  public/
    index.html
    dist/
  brunch-config.js
  package.json

This is my files config:

module.exports = {
  files: {
    javascripts: {
      entryPoints: { 'preprocess/js/app.js': 'dist/app.js' }
    }
  }
}
Reading here: http://brunch.io/docs/config#-files- , I'm assuming I just need to use entryPointslike I am if I only have one App file that imports all other modules in my app.
Ryan Sobol
@ryansobol
Oct 11 2016 13:40
@billcolumbia try renaming preprocess too app
Bill Columbia
@billcolumbia
Oct 11 2016 14:14
Trying that now @ryansobol
Colin Bate
@colinbate
Oct 11 2016 14:14
@billcolumbia It won't be just the module name, it will be the path relative from the watched parent folder, which by convention is app.
Bill Columbia
@billcolumbia
Oct 11 2016 14:16
Swapped the name to app
and then also updated config
files: {
    javascripts: {
      entryPoints: { 'app/js/app.js': 'dist/app.js' }
    },
    stylesheets: {
      joinTo: 'dist/app.css'
    }
  },
The correct use of entry points is:'entryFile.js': 'outputFile.js'. You are trying to use 'js/app.js' as an entry point, but it is probably an output file.
Im just trying to make a config that takes 1 JS file as import, and one CSS file as input and outputs each of them
Colin Bate
@colinbate
Oct 11 2016 14:21
It is probably easier to not use entryPoints in that case
Bill Columbia
@billcolumbia
Oct 11 2016 14:21
Oh I thought thats what they were for
Colin Bate
@colinbate
Oct 11 2016 14:23

They should work the same, but they are new and come with some caveats which may or may not matter to you, but honestly I haven't needed it much.

You might find that:

files: {
  javascripts: {
    joinTo: 'dist/app.js'
  }
}

works fine for you

Bill Columbia
@billcolumbia
Oct 11 2016 14:25
Ok, so what's the best way to tell brunch to just compile a single js file
Ok i will try that
Colin Bate
@colinbate
Oct 11 2016 14:26
If you want to make sure it is only that one file:
joinTo: {
  'dist/app.js': 'app/js/app.js'
}
Bill Columbia
@billcolumbia
Oct 11 2016 14:28
Hmmm
That worked for compiling
but it's still registering the module as its full path
require.register("/js/app.js"
or require.register("preprocess/js/app.js"
Colin Bate
@colinbate
Oct 11 2016 14:29
yes, if you have it in a subfolder js that will be part of the path to the module
Bill Columbia
@billcolumbia
Oct 11 2016 14:29
oh
Colin Bate
@colinbate
Oct 11 2016 14:29
if you don't want that, you have a couple of options
Bill Columbia
@billcolumbia
Oct 11 2016 14:30
So i would have to do this <script>require('preprocess/js/app.js').init()</script> ?
Colin Bate
@colinbate
Oct 11 2016 14:30
did you move preprocess into a folder called app?
Bill Columbia
@billcolumbia
Oct 11 2016 14:30
I did not
Colin Bate
@colinbate
Oct 11 2016 14:31
Ok, so you updated the paths config?
Bill Columbia
@billcolumbia
Oct 11 2016 14:31
paths: {
    watched: ['preprocess']
  },
Colin Bate
@colinbate
Oct 11 2016 14:32
ok, in that case you will also need to update modules.nameCleaner
which is a function which cleans the names of the modules, by default it strips off the app folder, but if you aren't using that convention then you need to configure it explicitly.
Bill Columbia
@billcolumbia
Oct 11 2016 14:33
so like:
modules: {
    nameCleaner (path) {
      return path.replace(/^preprocess\/js\//,'')
    }
  }
Colin Bate
@colinbate
Oct 11 2016 14:34
that should do it.
Bill Columbia
@billcolumbia
Oct 11 2016 14:37
Cool that worked, added line for .js as well
Colin Bate
@colinbate
Oct 11 2016 14:38
Doesn't much matter if you have one file, but it already ignores the extension
Bill Columbia
@billcolumbia
Oct 11 2016 14:38
Ah ok
As commonjs normally would
Colin Bate
@colinbate
Oct 11 2016 14:41
yea, you can specify the extension, and that is useful if you have some template file which is also producing a module, so you'd have app.js and app.html say as two modules.
if you do that, note that only the first module registered with the same basename will work extensionless.
If you want to that be .js versus .html then you'd need to specify an order property on the files config.
Bill Columbia
@billcolumbia
Oct 11 2016 14:42
right right
Colin Bate
@colinbate
Oct 11 2016 14:43
anyway, hopefully things are sorted now, let us know if you have other issues.
Bill Columbia
@billcolumbia
Oct 11 2016 14:43
Now i'm just trying to figure out why app.js's contents are nested in an object at require('app').default
where default is the actual module being exported
export default {
  init () {
    console.log('Initialized!')
  }
}
Colin Bate
@colinbate
Oct 11 2016 14:45
that is how ES6 modules work when consumed in CommonJS style
Bill Columbia
@billcolumbia
Oct 11 2016 14:45
oh man
thats my bad then
I don't know how I haven't run into that
Colin Bate
@colinbate
Oct 11 2016 14:46
older versions of Babel used to smooth that out
Bill Columbia
@billcolumbia
Oct 11 2016 14:46
Screen Shot 2016-10-11 at 10.44.46 AM.png
ah
Thanks :)
Colin Bate
@colinbate
Oct 11 2016 14:47
you might be able to configure babel to export default at the module root as well
or you can export init as a named export