Added CoffeeScript loader support

Author: harentius

fixtures/js/index.coffee

@@ -0,0 +1,4 @@
+fun = () ->
+  document.getElementById("app").innerHTML = "<h1>Welcome to Your Coffee App</h1>"
+
+fun()

index.js

@@ -590,6 +590,27 @@ const publicApi = {
         return this;
     },
 
+    /**
+     * Call this if you plan on loading CoffeeScript files.
+     *
+     * Encore.enableCoffeeScriptLoader()
+     *
+     * Or, configure the coffee-loader options:
+     *
+     * Encore.enableCoffeeScriptLoader(function(coffeeScriptOptions) {
+     *      // http://coffeescript.org/#nodejs-usage
+     *      // coffeeScriptOptions.header = true;
+     * });
+     *
+     * @param {function} callback
+     * @return {exports}
+     */
+    enableCoffeeScriptLoader(callback = () => {}) {
+        webpackConfig.enableCoffeeScriptLoader(callback);
+
+        return this;
+    },
+
     /**
      * Call this to enable forked type checking for TypeScript loader
      * https://github.com/TypeStrong/ts-loader/blob/v2.3.0/README.md#faster-builds

lib/WebpackConfig.js

@@ -60,6 +60,7 @@ class WebpackConfig {
         this.usePreact = false;
         this.useVueLoader = false;
         this.useTypeScriptLoader = false;
+        this.useCoffeeScriptLoader = false;
         this.useForkedTypeScriptTypeChecking = false;
         this.useWebpackNotifier = false;
 
@@ -79,6 +80,7 @@ class WebpackConfig {
         this.babelConfigurationCallback = () => {};
         this.vueLoaderOptionsCallback = () => {};
         this.tsConfigurationCallback = () => {};
+        this.coffeeScriptConfigurationCallback = () => {};
 
         // Plugins options
         this.cleanWebpackPluginPaths = ['**/*'];
@@ -393,6 +395,16 @@ class WebpackConfig {
             forkedTypeScriptTypesCheckOptionsCallback;
     }
 
+    enableCoffeeScriptLoader(callback = () => {}) {
+        this.useCoffeeScriptLoader = true;
+
+        if (typeof callback !== 'function') {
+            throw new Error('Argument 1 to enableCoffeeScriptLoader() must be a callback function.');
+        }
+
+        this.coffeeScriptConfigurationCallback = callback;
+    }
+
     enableVueLoader(vueLoaderOptionsCallback = () => {}) {
         this.useVueLoader = true;
 

lib/config-generator.js

@@ -18,6 +18,7 @@ const lessLoaderUtil = require('./loaders/less');
 const stylusLoaderUtil = require('./loaders/stylus');
 const babelLoaderUtil = require('./loaders/babel');
 const tsLoaderUtil = require('./loaders/typescript');
+const coffeeScriptLoaderUtil = require('./loaders/coffee-script');
 const vueLoaderUtil = require('./loaders/vue');
 // plugins utils
 const extractTextPluginUtil = require('./plugins/extract-text');
@@ -209,6 +210,13 @@ class ConfigGenerator {
             });
         }
 
+        if (this.webpackConfig.useCoffeeScriptLoader) {
+            rules.push({
+                test: /\.coffee$/,
+                use: coffeeScriptLoaderUtil.getLoaders(this.webpackConfig)
+            });
+        }
+
         this.webpackConfig.loaders.forEach((loader) => {
             rules.push(loader);
         });

lib/features.js

@@ -51,6 +51,11 @@ const features = {
         packages: ['typescript', 'ts-loader'],
         description: 'process TypeScript files'
     },
+    coffeescript: {
+        method: 'enableCoffeeScriptLoader()',
+        packages: ['coffeescript', 'coffee-loader'],
+        description: 'process CoffeeScript files'
+    },
     forkedtypecheck: {
         method: 'enableForkedTypeScriptTypesChecking()',
         packages: ['typescript', 'ts-loader', 'fork-ts-checker-webpack-plugin'],

lib/loaders/coffee-script.js

@@ -0,0 +1,42 @@
+/*
+ * This file is part of the Symfony Webpack Encore package.
+ *
+ * (c) Fabien Potencier <fabien@symfony.com>
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+'use strict';
+
+const loaderFeatures = require('../features');
+
+/**
+ * @param {WebpackConfig} webpackConfig
+ * @return {Array} of loaders to use for coffeescript files
+ */
+module.exports = {
+    getLoaders(webpackConfig) {
+        loaderFeatures.ensurePackagesExist('coffeescript');
+
+        const options = {
+            sourceMap: webpackConfig.useSourceMaps,
+            transpile: {
+                presets: ['env']
+            }
+        };
+
+        // allow options to be configured
+        webpackConfig.coffeeScriptConfigurationCallback.apply(
+            options,
+            [options]
+        );
+
+        return [
+            {
+                loader: 'coffee-loader',
+                options: options,
+            },
+        ];
+    }
+};

package.json

@@ -55,6 +55,8 @@
     "babel-preset-react": "^6.23.0",
     "chai": "^3.5.0",
     "chai-fs": "^1.0.0",
+    "coffee-loader": "^0.9.0",
+    "coffeescript": "^2.0.2",
     "eslint": "^3.19.0",
     "eslint-plugin-header": "^1.0.0",
     "eslint-plugin-node": "^4.2.2",

test/WebpackConfig.js

@@ -609,6 +609,31 @@ describe('WebpackConfig object', () => {
         });
     });
 
+    describe('enableCoffeeScriptLoader', () => {
+        it('Calling method sets it', () => {
+            const config = createConfig();
+            config.enableCoffeeScriptLoader();
+
+            expect(config.useCoffeeScriptLoader).to.be.true;
+        });
+
+        it('Calling with callback', () => {
+            const config = createConfig();
+            const callback = () => {};
+            config.enableCoffeeScriptLoader(callback);
+
+            expect(config.coffeeScriptConfigurationCallback).to.equal(callback);
+        });
+
+        it('Calling with non-callback throws an error', () => {
+            const config = createConfig();
+
+            expect(() => {
+                config.enableCoffeeScriptLoader('FOO');
+            }).to.throw('must be a callback function');
+        });
+    });
+
     describe('enableVueLoader', () => {
         it('Call with no config', () => {
             const config = createConfig();

test/config-generator.js

@@ -333,6 +333,30 @@ describe('The config-generator function', () => {
         });
     });
 
+    describe('enableCoffeeScriptLoader() adds the coffee-loader', () => {
+        it('without enableCoffeeScriptLoader()', () => {
+            const config = createConfig();
+            config.outputPath = '/tmp/output/public-path';
+            config.publicPath = '/public-path';
+            config.addEntry('main', './main');
+            const actualConfig = configGenerator(config);
+
+            expect(JSON.stringify(actualConfig.module.rules)).to.not.contain('coffee-loader');
+        });
+
+        it('enableCoffeeScriptLoader()', () => {
+            const config = createConfig();
+            config.outputPath = '/tmp/output/public-path';
+            config.publicPath = '/public-path';
+            config.addEntry('main', './main');
+            config.enableCoffeeScriptLoader();
+
+            const actualConfig = configGenerator(config);
+
+            expect(JSON.stringify(actualConfig.module.rules)).to.contain('coffee-loader');
+        });
+    });
+
     describe('addLoader() adds a custom loader', () => {
         it('addLoader()', () => {
             const config = createConfig();

test/functional.js

@@ -831,6 +831,37 @@ module.exports = {
             }).to.throw('wrong `tsconfig` path in fork plugin configuration (should be a relative or absolute path)');
         });
 
+        it('When configured, CoffeeScript is compiled', (done) => {
+            const config = createWebpackConfig('www/build', 'dev');
+            config.setPublicPath('/build');
+            config.addEntry('main', ['./js/index.coffee']);
+            const testCallback = () => {};
+            config.enableCoffeeScriptLoader(testCallback);
+
+            testSetup.runWebpack(config, (webpackAssert) => {
+                webpackAssert.assertOutputFileContains(
+                    'main.js',
+                    'return document.getElementById("app").innerHTML = "<h1>Welcome to Your Coffee App</h1>"'
+                );
+
+                expect(config.outputPath).to.be.a.directory().with.deep.files([
+                    'main.js',
+                    'manifest.json'
+                ]);
+
+                testSetup.requestTestPage(
+                    path.join(config.getContext(), 'www'),
+                    [
+                        'build/main.js'
+                    ],
+                    (browser) => {
+                        browser.assert.text('#app h1', 'Welcome to Your Coffee App');
+                        done();
+                    }
+                );
+            });
+        });
+
         it('The output directory is cleaned between builds', (done) => {
             const config = createWebpackConfig('www/build', 'dev');
             config.setPublicPath('/build');