Config and dotfiles

.babelrc

@@ -0,0 +1,3 @@
+{
+  "presets": ["es2015", "react", "stage-2"]
+}

.editorconfig

@@ -0,0 +1,14 @@
+# editorconfig.org
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+max_line_length = 100
+
+[*.md]
+trim_trailing_whitespace = false

.eslintrc

@@ -0,0 +1,3 @@
+---
+extends:
+  - ./config/eslint/.eslintrc

.gitignore

@@ -0,0 +1,19 @@
+\.git
+\.hg
+
+\.DS_Store
+\.idea
+\.project
+\.vagrant
+bower_components
+node_modules
+npm-debug\.log*
+jmeter.log
+
+# Config overrides
+config/local*
+
+# Build
+dist
+lib
+coverage

config/eslint/.eslintrc

@@ -0,0 +1,4 @@
+---
+extends:
+  - "defaults/configurations/walmart/es6-react"
+  - ".eslintrc-base"

config/eslint/.eslintrc-base

@@ -0,0 +1,22 @@
+---
+plugins:
+  - "filenames"
+
+rules:
+  filenames/filenames: [2, "^[a-z\\-\\.]+$"] # dash-cased filenames.
+  quotes:              [2, "single"]
+  spaced-comment: [2, "always"]
+  indent: [2, 2, {"SwitchCase": 1}]
+  jsx-quotes: [2, "prefer-single"]
+  arrow-parens: [1, "as-needed"]
+  no-fallthrough: 2
+  no-arrow-condition: 0
+  no-confusing-arrow: [2, {"allowParens": false}]
+
+env:
+  es6: true
+
+// 2 declaration needed because of this bug https://github.com/eslint/eslint/issues/1963
+ecmaFeatures:
+  module: true
+  modules: true

config/eslint/.eslintrc-test

@@ -0,0 +1,16 @@
+---
+extends:
+  - "defaults/configurations/walmart/es6-test"
+  - ".eslintrc-base"
+
+env:
+  mocha: true
+
+globals:
+  expect: true
+  sandbox: true
+
+rules:
+  max-nested-callbacks: [2, 5]
+  no-unused-expressions: 0
+

config/karma/karma.conf.coverage.js

@@ -0,0 +1,28 @@
+'use strict';
+/*
+ * Karma Configuration: 'coverage' version.
+ *
+ * This configuration is the same as basic one-shot version, just with coverage.
+ */
+var path = require('path');
+var webpackCovCfg = require('../webpack/webpack.config.coverage');
+
+// Replace with `__dirname` if using in project root.
+var ROOT = process.cwd();
+
+module.exports = function (config) {
+  /* eslint-disable global-require */
+  require('./karma.conf')(config);
+  config.set({
+    reporters: ['spec', 'coverage'],
+    webpack: webpackCovCfg,
+    coverageReporter: {
+      reporters: [
+        { type: 'json', file: 'coverage.json' },
+        { type: 'lcov' },
+        { type: 'text-summary' }
+      ],
+      dir: path.join(ROOT, 'coverage/client')
+    }
+  });
+};

config/karma/karma.conf.dev.js

@@ -0,0 +1,31 @@
+'use strict';
+/*
+ * Karma Configuration: 'dev' version.
+ *
+ * This configuration relies on a `webpack-dev-server` already running and
+ * bundling `webpack.config.test.js` on port 3001. If this is not running,
+ * then the alternate `karma.conf.js` file will _also_ run the webpack dev
+ * server during the test run.
+ */
+module.exports = function (config) {
+  config.set({
+    frameworks: ['mocha', 'phantomjs-shim'],
+    reporters: ['spec'],
+    browsers: ['PhantomJS'],
+    basePath: '.', // repository root.
+    files: [
+      // Sinon has issues with webpack. Do global include.
+      require.resolve('sinon/pkg/sinon'),
+
+      // Test bundle (must be created via `npm run dev|hot|server-test`)
+      'http://127.0.0.1:3001/assets/main.js'
+    ],
+    port: 9999,
+    singleRun: true,
+    client: {
+      mocha: {
+        ui: 'bdd'
+      }
+    }
+  });
+};

config/karma/karma.conf.js

@@ -0,0 +1,49 @@
+'use strict';
+/*
+ * Karma Configuration: 'full' version.
+ *
+ * This configuration runs a temporary `webpack-dev-server` and builds
+ * the test files one-off for just a single run. This is appropriate for a
+ * CI environment or if you're not otherwise running `npm run dev|hot`.
+ */
+var path = require('path');
+var webpackCfg = require('../webpack/webpack.config.test');
+
+var MAIN_PATH = path.join(process.cwd(), 'test/main.js');
+var PREPROCESSORS = {};
+PREPROCESSORS[MAIN_PATH] = ['webpack'];
+
+module.exports = function (config) {
+  /* eslint-disable global-require */
+
+  // Start with the 'dev' (webpack-dev-server is already running) config
+  // and add in the webpack stuff.
+  require('./karma.conf.dev')(config);
+
+  // Overrides.
+  config.set({
+    preprocessors: PREPROCESSORS,
+    files: [
+      // Sinon has issues with webpack. Do global include.
+      require.resolve('sinon/pkg/sinon'),
+
+      // Test bundle (created via local webpack-dev-server in this config).
+      MAIN_PATH
+    ],
+    webpack: webpackCfg,
+    webpackServer: {
+      port: 3002, // Choose a non-conflicting port (3000 app, 3001 test dev)
+      quiet: false,
+      noInfo: true,
+      stats: {
+        assets: false,
+        colors: true,
+        version: false,
+        hash: false,
+        timings: false,
+        chunks: false,
+        chunkModules: false
+      }
+    }
+  });
+};

config/webpack/webpack.config.coverage.js

@@ -0,0 +1,20 @@
+'use strict';
+/**
+ * Webpack frontend test (w/ coverage) configuration.
+ */
+var _ = require('lodash'); // devDependency
+var testCfg = require('./webpack.config.test');
+
+module.exports = _.merge({}, testCfg, {
+  module: {
+    preLoaders: [
+      // Manually instrument client code for code coverage.
+      // https://github.com/deepsweet/isparta-loader handles ES6 + normal JS.
+      {
+        test: /src\/.*\.jsx?$/,
+        exclude: /(test|node_modules)\//,
+        loader: require.resolve('isparta-loader')
+      }
+    ]
+  }
+});

config/webpack/webpack.config.dev.js

@@ -0,0 +1,14 @@
+'use strict';
+
+var webpack = require('webpack');
+var config = require('./webpack.config');
+
+// **WARNING**: Mutates base configuration.
+// We do this because lodash isn't available in `production` mode.
+config.output.filename = config.output.filename.replace(/\.min\.js$/, '.js');
+config.plugins = [
+  new webpack.SourceMapDevToolPlugin('[file].map')
+];
+
+// Export mutated base.
+module.exports = config;

config/webpack/webpack.config.js

@@ -0,0 +1,86 @@
+'use strict';
+
+var path = require('path');
+var webpack = require('webpack');
+
+// Replace with `__dirname` if using in project root.
+var ROOT = process.cwd();
+var SRC = path.join(ROOT, 'src');
+var CLIENT = path.join(ROOT, 'test');
+
+// **Little Hacky**: Infer the filename and library name from the package name.
+//
+// Assumptions:
+// - `package.json`'s `name` field is name of dist files.
+// - PascalCased version of that name is exported class name.
+var PKG = require(path.join(ROOT, 'package.json'));
+var libPath = (PKG.name || '').toLowerCase();
+if (!libPath) { throw new Error('Need package.json:name field'); }
+// PascalCase (with first character capitalized).
+var libName = libPath
+  .replace(/^\s+|\s+$/g, '')
+  .replace(/(^|[-_ ])+(.)/g, function (match, first, second) {
+    // Second match group is the character we want to change. Throw away first.
+    return second.toUpperCase();
+  });
+
+module.exports = {
+  cache: true,
+  context: SRC,
+  entry: './index.js',
+  externals: [
+    {
+      'react': {
+        root: 'React',
+        commonjs2: 'react',
+        commonjs: 'react',
+        amd: 'react'
+      }
+    },
+    {
+      'radium': {
+        root: 'Radium',
+        commonjs2: 'radium',
+        commonjs: 'radium',
+        amd: 'radium'
+      }
+    }
+  ],
+  output: {
+    path: path.join(ROOT, 'dist'),
+    filename: libPath + '.min.js',
+    library: libName,
+    libraryTarget: 'umd'
+  },
+  resolve: {
+    extensions: ['', '.js', '.jsx']
+  },
+  module: {
+    loaders: [
+      {
+        test: /\.jsx?$/,
+        // Use include specifically of our sources.
+        // Do _not_ use an `exclude` here.
+        include: [SRC, CLIENT],
+        // **Note**: Cannot use shorthand `'babel-loader'` or `'babel'` when
+        // we are playing around with `NODE_PATH` in builder. Manually
+        // resolve path.
+        loader: require.resolve('babel-loader')
+      }
+    ]
+  },
+  plugins: [
+    new webpack.optimize.DedupePlugin(),
+    new webpack.optimize.UglifyJsPlugin({
+      compress: {
+        warnings: false
+      }
+    }),
+    new webpack.DefinePlugin({
+      // Signal production, so that webpack removes non-production code that
+      // is in condtionals like: `if (process.env.NODE_ENV === 'production')`
+      'process.env.NODE_ENV': JSON.stringify('production')
+    }),
+    new webpack.SourceMapDevToolPlugin({filename: '[file].map'})
+  ]
+};

config/webpack/webpack.config.test.js

@@ -0,0 +1,42 @@
+'use strict';
+/**
+ * Webpack frontend test configuration.
+ */
+var path = require('path');
+var prodCfg = require('./webpack.config');
+
+// Replace with `__dirname` if using in project root.
+var ROOT = process.cwd();
+var _ = require('lodash'); // devDependency
+
+module.exports = {
+  cache: true,
+  context: path.join(ROOT, 'test'),
+  entry: './main',
+  output: {
+    filename: 'main.js',
+    publicPath: '/assets/'
+  },
+  resolve: _.merge({}, prodCfg.resolve, {
+    alias: {
+      // enzyme webpack issue https://github.com/airbnb/enzyme/issues/47
+      sinon: 'node_modules/sinon/pkg/sinon.js',
+      // Allow root import of `src/FOO` from ROOT/src.
+      src: path.join(ROOT, 'src')
+    }
+  }),
+  // enzyme webpack issue https://github.com/airbnb/enzyme/issues/47
+  externals: {
+    'cheerio': 'window',
+    'react/lib/ExecutionEnvironment': true,
+    'react/lib/ReactContext': true,
+    'react/addons': true
+  },
+  module: _.assign({}, prodCfg.module, {
+    // enzyme webpack issue https://github.com/airbnb/enzyme/issues/47
+    noParse: [
+      /\/sinon\.js/
+    ]
+  }),
+  devtool: 'source-map'
+};