How can I add custom loader?

[reapp]

How can I add custom loader?

[natew]

We need to add this in, but you won't need to modify server modules. You could leave them in node_modules and we just need to add a plug option.

On Feb 15, 2015, at 11:25 PM, Kohei Hasegawa [email protected] wrote:

I've just tried to integrate with my existing application with reapp.
I have few CoffeeScript files in my application.
I put config/build.js and config/build.config.js refered to https://github.com/reapp/hacker-news-app/tree/master/config and https://github.com/reapp/reapp-pack/blob/master/index.js#L59.

module.exports = pack({
loaders: [
{ test: /.coffee$/, loader: 'coffee-loader' }
]
});
However how can I connect files with under server_modules? Thanks.

☁ ls -la server_modules
...
lrwxr-xr-x 1 banyan staff 96 2 16 01:38 autoprefixer-loader -> /Users/banyan/node_modules/reapp/node_modules/reapp-pack/lib/../node_modules/autoprefixer-loader
lrwxr-xr-x 1 banyan staff 90 2 16 01:38 bundle-loader -> /Users/banyan/node_modules/reapp/node_modules/reapp-pack/lib/../node_modules/bundle-loader
...
—
Reply to this email directly or view it on GitHub.

[natew]

One thing we need to figure out is: do user defined loaders override the loaders we provide, or do they augment them, and if so, how?

I feel like reapp-pack really just is a starting off point. You can really just export and webpack config from your run.config.js, and if you do reapp run -d it will output your config file. You can then use that and customize from there.

Thoughts?

[banyan]

if you do reapp run -d it will output your config file. You can then use that and customize from there.

I agree. This is simple and good point to start.

[mbrgm]

I succeeded in exporting the webpack config and adding a loader, but now I'm getting an error at
(anonymous function) (only-dev-server.js:82) saying [HMR] Hot Module Replacement is disabled. I just want to add a raw loader for .woff files and be able to use it with reapp build and reapp run. Is there a really simplistic way for doing that?

[natew]

You could definitely do something like var conf = pack({ // your config, linkModules: true }) and then conf.loaders.push(). That should work, just be sure you install the loader into your node_modules.

[mbrgm]

For everyone trying this, I finally managed to get it working:

// config/runconfig.js

var pack = require('reapp-pack')
var path = require('path')

var dir = path.join(__dirname, '..')

module.exports = pack(
  { debug: true
  , devtool: 'eval'
  , dir: dir
  , entry: './app/app.js'
  , extensions: [ '', '.cjsx', '.coffee', '.js', '.jsx', '.web.js' ]
  , hot: true
  , loaders: 
    [ { test: /\.cjsx$/, loader: 'coffee!cjsx' }
    , { test: /\.coffee$/, loader: 'coffee' }
    , { test: /\.woff$/, loader: 'raw' }
    ]
  , port: 3011
  , server: true
  , target: 'web'
  })

Note that you have to set the dir property. You'll also have to install the default loaders manually. Just run after setting the config and then install all missing modules.

[natew]

Thanks @mbrgm, I'll work on getting this better documented.