diff --git a/example/source/archive.jsx b/example/source/archive.jsx
@@ -1,25 +1,16 @@
-import { filterByAttributes } from 'fuzzy-chainsaw-styleguide/helpers/context';
+// import {
+//   filterByAttributes,
+//   filterByPath
+// } from 'fuzzy-chainsaw-styleguide/helpers/context';
 
-const fileRegex = /^(?!.*\.test\.jsx$).*\.(jsx|md)$/;
+const filterByAttributes = (a) => a;
+const filterByPath = (a) => a;
 
 // this regex selects *.jsx and *.md files, but skips *.test.jsx
-const pagesContext = require.context('@pages/', true, fileRegex);
-const compositionsContext = require.context('@compositions/', true, fileRegex);
-const componentsContext = require.context('@components/', true, fileRegex);
-const tagsContext = require.context('@tags/', true, fileRegex);
+const pagesContext = require.context('@pages/', true, /^(?!.*\.test\.jsx$).*\.(jsx|md)$/);
+const elementsContext = require.context('@elements/', true, /^(?!.*\.test\.jsx$).*\.(jsx|md)$/);
 
 // http://localhost:8080/styleguide/?element=tags/Heading&example=QiRiY3n
-const pageGroups = [{
-  title: 'Indexes',
-  filter: filterByAttributes({ pageType: 'index' })
-}, {
-  title: 'Pages',
-  filter: filterByAttributes({ theme: undefined, pageType: (type) => type !== 'index' })
-}, {
-  title: 'Generic Pages',
-  filter: filterByAttributes({ theme: 'generic', pageType: (type) => type !== 'index' })
-}];
-
 const elementGroups = [{
   filter: filterByAttributes({ pageType: undefined })
 }, {
@@ -42,21 +33,37 @@ const elementGroups = [{
 
 export default {
   pages: [{
+    title: 'Indexes',
+    context: pagesContext,
+    filter: filterByAttributes({ pageType: 'index' })
+  }, {
     title: 'Pages',
     context: pagesContext,
-    groups: pageGroups
+    filter: filterByAttributes({ theme: undefined, pageType: (type) => type !== 'index' })
+  }, {
+    title: 'Generic Pages',
+    context: pagesContext,
+    filter: filterByAttributes({ theme: 'generic', pageType: (type) => type !== 'index' })
   }],
   elements: [{
     title: 'Compositions',
-    context: compositionsContext,
+    context: elementsContext,
+    filter: filterByPath('compositions/**/*'),
     groups: elementGroups
   }, {
     title: 'Components',
-    context: componentsContext,
+    context: elementsContext,
+    filter: filterByPath('components/**/*'),
     groups: elementGroups
   }, {
     title: 'Tags',
-    context: tagsContext,
+    context: elementsContext,
+    filter: filterByPath('tags/**/*'),
+    groups: elementGroups
+  }, {
+    title: 'Modifiers',
+    context: elementsContext,
+    filter: filterByPath('modifiers/**/*'),
     groups: elementGroups
   }]
 };
diff --git a/example/source/dev.jsx b/example/source/dev.jsx
@@ -1,9 +1,7 @@
-// import FC helpers
 import startDevMode from 'fuzzy-chainsaw-build/dev';
-
 import archive from '@config/archive';
 
-
 startDevMode({
+  appRoot: '.root',
   archive
 });
diff --git a/example/source/elements/tags/Media/Media.example.jsx b/example/source/elements/tags/Media/Media.example.jsx
@@ -1,8 +1,4 @@
-import Image from '@tags/Image/Image';
-import Heading from '@tags/Heading/Heading';
-import Rhythm from '@tags/Rhythm/Rhythm';
-
-import { Media } from '@tags';
+import { Image, Heading, Media, Rhythm } from '@tags';
 import randySavage from './assets/randy-savage.jpg';
 
 

diff --git a/example/source/elements/tags/index.js b/example/source/elements/tags/index.js
@@ -1,13 +1,13 @@
 // export tag aliases
-export Brand from '@tags/Brand/Brand';
-export Button from '@tags/Button/Button';
-export Heading from '@tags/Heading/Heading';
-export Icon from '@tags/Icon/Icon';
-export Image from '@tags/Image/Image';
-export Link from '@tags/Link/Link';
-export List from '@tags/List/List';
-export Media from '@tags/Media/Media';
-export PlaceholderSvg from '@tags/PlaceholderSvg/PlaceholderSvg';
-export Rhythm from '@tags/Rhythm/Rhythm';
-export RichText from '@tags/RichText/RichText';
-export Wrapper from '@tags/Wrapper/Wrapper';
+export { default as Brand } from '@tags/Brand/Brand';
+export { default as Button } from '@tags/Button/Button';
+export { default as Heading } from '@tags/Heading/Heading';
+export { default as Icon } from '@tags/Icon/Icon';
+export { default as Image } from '@tags/Image/Image';
+export { default as Link } from '@tags/Link/Link';
+export { default as List } from '@tags/List/List';
+export { default as Media } from '@tags/Media/Media';
+export { default as PlaceholderSvg } from '@tags/PlaceholderSvg/PlaceholderSvg';
+export { default as Rhythm } from '@tags/Rhythm/Rhythm';
+export { default as RichText } from '@tags/RichText/RichText';
+export { default as Wrapper } from '@tags/Wrapper/Wrapper';
diff --git a/example/source/lib/README.md b/example/source/lib/README.md
@@ -1,3 +1,3 @@
 # Lib Folder
 
-Put non element code here.
+Put non element code and assets here.
diff --git a/example/source/config/favicon.png → example/source/lib/favicon.png b/example/source/config/favicon.png → example/source/lib/favicon.png
diff --git a/example/source/config/skeleton.html → example/source/lib/skeleton.html b/example/source/config/skeleton.html → example/source/lib/skeleton.html
diff --git a/example/source/pages/index.jsx b/example/source/pages/index.jsx
@@ -1,9 +1,11 @@
-import Heading from '@tags/Heading/Heading';
-import Rhythm from '@tags/Rhythm/Rhythm';
-import Wrapper from '@tags/Wrapper/Wrapper';
+import {
+  Heading,
+  Rhythm,
+  Wrapper
+} from '@tags';
 
-import { TableOfContents } from '@styleguide/TableOfContents';
-import archive from '@source/archive';
+// import { TableOfContents } from 'fuzzy-chainsaw-styleguide/source/components';
+// import archive from '@source/archive';
 
 const page = () => (
   <Wrapper size="wide">
@@ -15,11 +17,11 @@ const page = () => (
 
       <br />
 
-      <TableOfContents archive={archive} />
     </Rhythm>
   </Wrapper>
 );
 
+      // <TableOfContents archive={archive} />
 page.pageTitle = 'Fuzzy Chainsaw';
 page.pageType = 'index';
 

diff --git a/fuzzy-chainsaw-build/testing/main.js → example/source/tests.js b/fuzzy-chainsaw-build/testing/main.js → example/source/tests.js
diff --git a/example/yarn.lock b/example/yarn.lock
diff --git a/fuzzy-chainsaw-build/gulp-tasks/clean-factory.js b/fuzzy-chainsaw-build/gulp-tasks/clean-factory.js
@@ -0,0 +1,34 @@
+/*
+  This task deletes old files before a webpack bundle
+*/
+
+const del = require('del');
+
+module.exports = (fcBuildConfig) => (factoryOptions) => {
+  const { dest } = fcBuildConfig.pathHelpers;
+  const { outputDirectories } = fcBuildConfig.fcConfig;
+
+  let paths = [];
+
+  if (factoryOptions.pre) {
+    paths = paths.concat([
+      dest('**/*.html'),
+      dest('*.json'),
+      dest(`${outputDirectories.js}/*.{js,js.map}`),
+      dest(`${outputDirectories.css}/*.{css,css.map}`),
+      dest(`${outputDirectories.fonts}/**`),
+      dest(`${outputDirectories.images}/**`),
+      dest(`${outputDirectories.offline}/**`),
+      dest(`${outputDirectories.svgs}/*`),
+      dest(`${outputDirectories.static}/*`)
+    ]);
+  }
+
+  if (factoryOptions.post) {
+    paths = paths.concat([
+      dest('tmp')
+    ]);
+  }
+
+  return () => del(paths, { force: true });
+};
diff --git a/fuzzy-chainsaw-build/gulp-tasks/karma-test-factory.js b/fuzzy-chainsaw-build/gulp-tasks/karma-test-factory.js
@@ -0,0 +1,32 @@
+/*
+  This task starts the karma test runner
+  in singleRun mode.
+*/
+
+const Server = require('karma').Server;
+const gutil = require('gulp-util');
+
+const karmaConfFactory = require('../testing/karma.conf.factory.js');
+
+
+module.exports = (buildConfig) => (factoryOptions) => (done) => {
+  const karmaConf = karmaConfFactory(buildConfig);
+
+  if (factoryOptions.singleRun) {
+    Object.assign(karmaConf, { singleRun: true });
+  }
+
+  new Server(karmaConf)
+    .on('browser_error', (browser, err) => {
+      gutil.log(`Karma Run Failed: ${err.message}`);
+      throw err;
+    })
+    .on('run_complete', (browsers, results) => {
+      if (results.failed) {
+        throw new Error('Karma: Tests Failed');
+      }
+      gutil.log('Karma Run Complete: No Failures');
+      done();
+    })
+    .start();
+};
diff --git a/...nsaw-build/gulp/tasks/scaffold-factory.js → ...nsaw-build/gulp-tasks/scaffold-factory.js b/...nsaw-build/gulp/tasks/scaffold-factory.js → ...nsaw-build/gulp-tasks/scaffold-factory.js
diff --git a/...build/gulp/tasks/static-render-factory.js → ...build/gulp-tasks/static-render-factory.js b/...build/gulp/tasks/static-render-factory.js → ...build/gulp-tasks/static-render-factory.js
@@ -14,7 +14,7 @@ const fs = require('fs');
 const {
   getContextList,
   renderComponent
-} = require('./lib/render-helpers');
+} = require('../lib/render-helpers');
 
 
 module.exports = ({ pathHelpers }) => ({ production }) => () => {

diff --git a/fuzzy-chainsaw-build/gulp-tasks/webpack-factory.js b/fuzzy-chainsaw-build/gulp-tasks/webpack-factory.js
@@ -0,0 +1,22 @@
+/*
+  This provides a factory that returns a gulp task
+  for building webpack.
+*/
+
+const webpack = require('webpack');
+const handleWebpackErrors = require('../webpack/lib/handleWebpackErrors');
+
+
+module.exports = (config, factoryOptions = {}) => {
+  if (factoryOptions.watch) {
+    return () => {
+      webpack(config).watch({ }, handleWebpackErrors);
+    };
+  }
+
+  return (done) => {
+    webpack(config, (err, stats) => (
+      handleWebpackErrors(err, stats, done)
+    ));
+  };
+};
diff --git a/fuzzy-chainsaw-build/gulp/installBuildTasks.js b/fuzzy-chainsaw-build/gulp/installBuildTasks.js
diff --git a/fuzzy-chainsaw-build/gulp/tasks/clean-post.js b/fuzzy-chainsaw-build/gulp/tasks/clean-post.js
diff --git a/fuzzy-chainsaw-build/gulp/tasks/clean-pre.js b/fuzzy-chainsaw-build/gulp/tasks/clean-pre.js
diff --git a/fuzzy-chainsaw-build/gulp/tasks/karma-test.js b/fuzzy-chainsaw-build/gulp/tasks/karma-test.js
diff --git a/fuzzy-chainsaw-build/gulp/tasks/webpack-build-factory.js b/fuzzy-chainsaw-build/gulp/tasks/webpack-build-factory.js
diff --git a/fuzzy-chainsaw-build/gulp/tasks/webpack-watch-factory.js b/fuzzy-chainsaw-build/gulp/tasks/webpack-watch-factory.js
diff --git a/fuzzy-chainsaw-build/index.js b/fuzzy-chainsaw-build/index.js
@@ -57,25 +57,20 @@ module.exports = (fcBuildConfig) => {
     })
   };
 
-
   return {
     fcBuildConfig,
-    karmaConfig: require('./karma.conf')(fcBuildConfig),
-    installBuildTasks: require('./gulp/installBuildTasks')(fcBuildConfig, webpackConfigs),
-    tasks: {
-      cleanPre: require('./gulp/tasks/clean-pre')(fcBuildConfig),
-      cleanPost: require('./gulp/tasks/clean-post')(fcBuildConfig),
-      karmaTest: require('./gulp/tasks/karma-test')(fcBuildConfig),
-      scaffoldFactory: require('./gulp/tasks/scaffold-factory')(fcBuildConfig),
-      staticRenderFactory: require('./gulp/tasks/static-render-factory')(fcBuildConfig),
-      webpackBuildFactory: require('./gulp/tasks/webpack-build-factory')(fcBuildConfig),
-      webpackWatchFactory: require('./gulp/tasks/webpack-watch-factory')(fcBuildConfig)
-    },
-    fcUtils: require('./lib/fc-utilities'),
-    renderHelpers: require('./lib/render-helpers'),
     pathHelpers,
     webpackConfigFactory,
     webpackDllFactory,
-    webpackConfigs
+    webpackConfigs,
+    karmaConfigFactory: require('./testing/karma.conf.factory')(fcBuildConfig),
+    installBuildTasks: require('./installBuildTasks')(fcBuildConfig, webpackConfigs),
+    tasks: {
+      cleanFactory: require('./gulp-tasks/clean-factory')(fcBuildConfig),
+      karmaTestFactory: require('./gulp-tasks/karma-test-factory')(fcBuildConfig),
+      scaffoldFactory: require('./gulp-tasks/scaffold-factory')(fcBuildConfig),
+      // staticRenderFactory: require('./gulp-tasks/static-render-factory')(fcBuildConfig),
+      webpackFactory: require('./gulp-tasks/webpack-factory')(fcBuildConfig)
+    }
   };
 };
diff --git a/fuzzy-chainsaw-build/installBuildTasks.js b/fuzzy-chainsaw-build/installBuildTasks.js
@@ -0,0 +1,127 @@
+/* eslint global-require: 0 */
+// const path = require('path');
+
+
+module.exports = (fcBuildConfig, webpackConfigs) => (gulp, taskOptions = { skip: [] }) => {
+  const sequence = require('run-sequence').use(gulp);
+
+  const cleanFactory = require('./gulp-tasks/clean-factory')(fcBuildConfig);
+  const karmaTestFactory = require('./gulp-tasks/karma-test-factory')(fcBuildConfig);
+  // const scaffoldFactory = require('./gulp-tasks/scaffold-factory');
+  // const staticRenderFactory = require('./gulp-tasks/static-render-factory')(fcBuildConfig);
+  const webpackFactory = require('./gulp-tasks/webpack-factory');
+
+  // duplicates gulp 4 type series api
+  const series = (...task) => (done) => sequence(...task, done);
+
+  // wrapper around gulp.task to provide install
+  // option to skip certain
+  const gulpTask = (name, fn) => {
+    if (taskOptions.skip.indexOf(name) < 0) {
+      gulp.task(name, fn);
+    }
+  };
+
+  // const { source } = fcBuildConfig.pathHelpers;
+
+  // clean certain directories and files
+  // before and after builds
+  gulpTask('clean:pre', cleanFactory({ pre: true }));
+  gulpTask('clean:post', cleanFactory({ post: true }));
+
+  // build tasks
+  gulpTask('webpack-dll:build', webpackFactory(webpackConfigs.dll));
+  gulpTask('webpack-dll:build:ci', webpackFactory(webpackConfigs.dllCi));
+  gulpTask('webpack-dll:production', webpackFactory(webpackConfigs.dllProduction));
+  gulpTask('webpack-dll:production:ci', webpackFactory(webpackConfigs.dllProductionCi));
+
+  // build tasks
+  gulpTask('webpack:build', webpackFactory(webpackConfigs.build));
+  gulpTask('webpack:build:ci', webpackFactory(webpackConfigs.buildCi));
+  gulpTask('webpack:production', webpackFactory(webpackConfigs.production));
+  gulpTask('webpack:production:ci', webpackFactory(webpackConfigs.productionCi));
+
+  // watch is a minimal watcher for intergration
+  // not requiring page rendering (only /assets)
+  gulpTask('webpack:watch', webpackFactory(webpackConfigs.productionCi, { watch: true }));
+
+  // static rendering with create static html from
+  // source pages and automatically constructs
+  // a component library for tags and components
+  // gulpTask('static:render', staticRenderFactory({ production: false }));
+  // gulpTask('static:render:production', staticRenderFactory({ production: true }));
+
+  // test code using karma
+  gulpTask('test', karmaTestFactory({ singleRun: true }));
+  gulpTask('test:dev', karmaTestFactory());
+
+
+  gulpTask('watch', series(
+    'clean:pre',
+    'webpack:watch'
+  ));
+
+  // builds for quick publishing
+  // to a static server
+  gulpTask('build', series(
+    'clean:pre',
+    'webpack:build',
+    // 'static:render',
+    'clean:post',
+    'test'
+  ));
+
+  // builds a production ready set
+  // of static assets and html
+  gulpTask('production', series(
+    'clean:pre',
+    'webpack:production',
+    // 'static:render:production',
+    'clean:post'
+  ));
+
+  // builds a minimal set of static
+  // assets (only /assets folder, no html)
+  // hint: this will be faster for integrators
+  gulpTask('build:ci', series(
+    'clean:pre',
+    'webpack:build:ci',
+    'clean:post'
+  ));
+
+  // builds a minimal set of minified static assets
+  gulpTask('production:ci', series(
+    'clean:pre',
+    'webpack:production:ci',
+    'clean:post'
+  ));
+
+
+  // scaffolding tasks
+  // tasks here require cli arguments
+
+  // gulp scaffold:tag --name [name]
+
+  // gulpTask('scaffold:tag', scaffoldFactory({
+  //   src: path.resolve(__dirname, 'scaffolding/stateless-component'),
+  //   dest: source('elements/tags')
+  // }));
+
+  // // gulp scaffold:component --name [name]
+  // gulpTask('scaffold:component', scaffoldFactory({
+  //   src: path.resolve(__dirname, 'scaffolding/stateless-component'),
+  //   dest: source('elements/components')
+  // }));
+
+  // // gulp scaffold:composition --name [name]
+  // gulpTask('scaffold:composition', scaffoldFactory({
+  //   src: path.resolve(__dirname, 'scaffolding/stateless-component'),
+  //   dest: source('elements/composition')
+  // }));
+
+  // // gulp scaffold:component:stateful --name [name]
+  // gulpTask('scaffold:component:stateful', scaffoldFactory({
+  //   src: path.resolve(__dirname, 'scaffolding/stateful-component'),
+  //   dest: source('elements/components')
+  // }));
+};
diff --git a/fuzzy-chainsaw-build/lib/fc-utilities.jsx b/fuzzy-chainsaw-build/lib/fc-utilities.jsx
@@ -1,7 +1,10 @@
+const React = require('react');
+const PropsTypes = require('prop-types');
+
 // Alias tagName propType because it
 // gets used frequently
 
-PropTypes.tagName = PropTypes.oneOfType([
+PropsTypes.tagName = PropTypes.oneOfType([
   PropTypes.string,
   PropTypes.element,
   PropTypes.func
@@ -32,6 +35,8 @@ const createClassStack = (classList) => (
   basic component with a className
 */
 
+const omit = require('lodash.omit');
+
 const createBasicComponent = (config) => {
   const {
     name,
@@ -41,24 +46,21 @@ const createBasicComponent = (config) => {
 
   const Component = (props) => {
     const {
-      tagName: Tag,
+      tagName,
       className,
       variant,
-      children,
-      ...attrs
+      children
     } = props;
 
-    const classStack = createClassStack([
+    const attrs = omit(props, 'tagName', 'className', 'variant', 'children');
+
+    attrs.className = createClassStack([
       name,
       variants && `${name}--${variant}`,
       className
     ]);
 
-    return (
-      <Tag className={classStack} {...attrs}>
-        {children}
-      </Tag>
-    );
+    return React.createElement(tagName, attrs, children);
   };
 
   Component.displayName = name;

diff --git a/fuzzy-chainsaw-build/package-lock.json b/fuzzy-chainsaw-build/package-lock.json
diff --git a/fuzzy-chainsaw-build/package.json b/fuzzy-chainsaw-build/package.json
@@ -2,6 +2,54 @@
   "name": "fuzzy-chainsaw-build",
   "version": "3.0.0-beta",
   "scripts": {
-  	"build": ""
+    "build": ""
+  },
+  "dependencies": {
+    "clean-webpack-plugin": "^0.1.16",
+    "copy-webpack-plugin": "^4.0.1",
+    "css-loader": "^0.28.4",
+    "del": "^3.0.0",
+    "dopl": "0.2.0",
+    "enzyme": "^2.9.1",
+    "extract-text-webpack-plugin": "^3.0.0",
+    "favicons-webpack-plugin": "^0.0.7",
+    "file-loader": "^0.11.2",
+    "gulp": "^3.9.1",
+    "gulp-file": "^0.3.0",
+    "gulp-htmlmin": "^3.0.0",
+    "gulp-if": "^2.0.2",
+    "gulp-merge": "^0.1.1",
+    "gulp-print": "^2.0.1",
+    "html-loader": "^0.4.5",
+    "html-webpack-plugin": "^2.29.0",
+    "image-webpack-loader": "^3.3.1",
+    "jimp": "^0.2.28",
+    "jsdom": "^11.1.0",
+    "json-loader": "^0.5.4",
+    "karma": "^1.7.0",
+    "karma-phantomjs-launcher": "^1.0.4",
+    "karma-tap": "^3.1.1",
+    "karma-webpack": "^2.0.3",
+    "loader-utils": "^1.1.0",
+    "lodash.omit": "^4.5.0",
+    "markdown-loader": "^2.0.1",
+    "null-loader": "^0.1.1",
+    "object.assign": "^4.0.4",
+    "offline-plugin": "^4.8.3",
+    "postcss-pipeline-webpack-plugin": "^3.0.0",
+    "progress-bar-webpack-plugin": "^1.9.3",
+    "prop-types": "^15.5.10",
+    "react": "^15.6.1",
+    "react-addons-test-utils": "^15.6.0",
+    "react-modal": "^2.2.2",
+    "react-test-renderer": "^15.6.1",
+    "run-sequence": "^2.1.0",
+    "stats-webpack-plugin": "^0.6.1",
+    "style-loader": "^0.18.2",
+    "webpack": "^3.2.0",
+    "webpack-merge": "4.1.0",
+    "webpack-node-externals": "^1.6.0",
+    "webpack-notifier": "^1.5.0",
+    "webpack-svgstore-plugin": "^4.0.1"
   }
 }
diff --git a/fuzzy-chainsaw-build/testing/karma.conf.factory.js b/fuzzy-chainsaw-build/testing/karma.conf.factory.js
@@ -0,0 +1,26 @@
+const stats = require('../webpack/lib/webpack-stats');
+const webpackConfigFactory = require('../webpack/config.factory');
+
+module.exports = (fcBuildConfig) => {
+  const { directories } = fcBuildConfig.pkg;
+  const { dest, source } = fcBuildConfig.pathHelpers;
+
+  return {
+    browsers: ['PhantomJS'],
+    files: [
+      { pattern: dest('assets/dlls/*.js'), watched: false },
+      { pattern: source(`${directories.source}/**/*.test.*`), watched: true }
+    ],
+    frameworks: ['tap'],
+    preprocessors: {
+      [`${directories.source}/**/*`]: ['webpack']
+    },
+    webpack: webpackConfigFactory(fcBuildConfig)({ test: true }),
+    webpackMiddleware: {
+      stats
+    },
+    client: {
+      captureConsole: false
+    }
+  };
+};
diff --git a/fuzzy-chainsaw-build/testing/karma.conf.js b/fuzzy-chainsaw-build/testing/karma.conf.js
diff --git a/fuzzy-chainsaw-build/webpack/config.factory.js b/fuzzy-chainsaw-build/webpack/config.factory.js
@@ -24,48 +24,58 @@ const SvgStorePlugin = require('webpack-svgstore-plugin');
 const WebpackNotifierPlugin = require('webpack-notifier');
 
 const stats = require('./lib/webpack-stats');
-// const { production: postcssProductionPipeline } = require('./lib/postcss-plugins.js');
 
 
-module.exports = (buildConfig) => (factoryOpts) => {
-  const { source, dest, baseUrl } = buildConfig.pathHelpers;
-  const { entries, outputFormats } = buildConfig.fcConfig;
+module.exports = (fcBuildConfig) => (factoryOpts) => {
+  const { pkg, postcssPlugins } = fcBuildConfig;
+  const { baseUrl, dest, source, sourceAll } = fcBuildConfig.pathHelpers;
+  const { entries, outputDirectories, outputFormats, outputSort } = fcBuildConfig.fcConfig;
+
+  const skeletonConfig = {
+    // dllStats,
+    template: source('lib/skeleton.html'),
+    inject: true,
+    chunksSortMode: outputSort
+  };
 
   const shared = {
     devtool: 'source-map',
     resolve: {
       extensions: ['.js', '.jsx'],
       alias: Object.assign({
-        FcUtils: path.resolve(__dirname, '../../lib/fc-utilities'),
+        FcUtils: path.resolve(__dirname, '../lib/fc-utilities'),
 
         '@source': source(),
-        '@static': source('static'),
+        '@config': source('config'),
         '@lib': source('lib'),
+        '@static': source('static'),
         '@pages': source('pages'),
 
         '@elements': source('elements'),
         '@vars': source('elements/variables'),
         '@tags': source('elements/tags'),
         '@components': source('elements/components'),
         '@compositions': source('elements/compositions'),
-        '@modifiers': source('elements/modifiers'),
-
-        '@styleguide': source('styleguide'),
-        '@sg-vars': source('styleguide/variables'),
-        '@sg-tags': source('styleguide/tags'),
-        '@sg-components': source('styleguide/components')
-      }, buildConfig.alias)
+        '@modifiers': source('elements/modifiers')
+      }, fcBuildConfig.alias)
+    },
+    resolveLoader: {
+      modules: [
+        path.resolve(__dirname, '..', 'node_modules'),
+        path.resolve(fcBuildConfig.directories.root, 'node_modules')
+      ]
     },
     output: {
       path: dest(),
       publicPath: baseUrl,
-      filename: `assets/${outputFormats.js}`,
+      filename: `${outputDirectories.js}/${outputFormats.js}`,
       libraryTarget: 'umd'
     },
     module: {
       rules: [
         {
           test: /\.(jsx|js)$/,
+          exclude: /node_modules\/(?!(FcUtils)\/)/,
           enforce: 'pre',
           loader: 'eslint-loader' // linting
         },
@@ -81,8 +91,8 @@ module.exports = (buildConfig) => (factoryOpts) => {
     },
     plugins: [
       new webpack.DllReferencePlugin({
-        context: buildConfig.root,
-        manifest: require(dest('assets/dlls/vendor-manifest.json')) // eslint-disable-line
+        context: fcBuildConfig.root,
+        manifest: dest(`${outputDirectories.dll}/vendor-manifest.json`) // eslint-disable-line
       }),
       new webpack.DefinePlugin({
         'process.env.BASE_URL': JSON.stringify(baseUrl)
@@ -95,15 +105,15 @@ module.exports = (buildConfig) => (factoryOpts) => {
     ]
   };
 
-  const browser = {
+  const assets = {
     module: {
       rules: [
         {
           test: /\.(woff|woff2|eot|ttf|otf)$/i,
           loader: 'file-loader',
           options: {
             context: './source/',
-            name: `assets/fonts/${outputFormats.fonts}`
+            name: `${outputDirectories.fonts}/${outputFormats.fonts}`
           }
         },
         {
@@ -124,7 +134,7 @@ module.exports = (buildConfig) => (factoryOpts) => {
               loader: 'file-loader',
               options: {
                 context: './source/',
-                name: `assets/images/${outputFormats.images}`
+                name: `${outputDirectories.fonts}/${outputFormats.images}`
               }
             },
             {
@@ -188,7 +198,7 @@ module.exports = (buildConfig) => (factoryOpts) => {
           enforce: 'pre',
           loader: 'postcss-loader', // linting
           options: {
-            plugins: lintingPipeline
+            plugins: postcssPlugins.linting(fcBuildConfig, { alias: shared.resolve.alias })
           }
         },
         {
@@ -199,17 +209,17 @@ module.exports = (buildConfig) => (factoryOpts) => {
     },
     plugins: [
       new ProgressBarPlugin(),
-      new ExtractTextPlugin(`assets/${outputFormats.css}`),
+      new ExtractTextPlugin(`${outputDirectories.css}/${outputFormats.css}`),
       new PostCssPipelineWebpackPlugin({
         suffix: undefined,
-        pipeline: buildPipeline
+        pipeline: postcssPlugins.build(fcBuildConfig, { alias: shared.resolve.alias })
       }),
       new WebpackNotifierPlugin({
         title: 'FC Build'
       }),
       new FaviconsWebpackPlugin({
-        logo: source('favicon.png'),
-        prefix: `assets/favicons/${outputFormats.favIconPrefix}`,
+        logo: source('lib/favicon.png'),
+        prefix: `${outputDirectories.favIcons}/${outputFormats.favIconPrefix}`,
         persistentCache: false,
         icons: {
           android: false,
@@ -226,7 +236,7 @@ module.exports = (buildConfig) => (factoryOpts) => {
       }),
       new CopyWebpackPlugin([{
         from: source('static'),
-        to: 'assets/static'
+        to: outputDirectories.static
       }], {
         ignore: ['README.md']
       }),
@@ -257,7 +267,7 @@ module.exports = (buildConfig) => (factoryOpts) => {
       }),
       new PostCssPipelineWebpackPlugin({
         suffix: undefined,
-        pipeline: postcssProductionPipeline
+        pipeline: postcssPlugins.production(fcBuildConfig, { alias: shared.resolve.alias })
       }),
       new webpack.optimize.UglifyJsPlugin({
         sourceMap: true,
@@ -286,7 +296,7 @@ module.exports = (buildConfig) => (factoryOpts) => {
             {
               loader: 'postcss-loader',
               options: {
-                plugins: devPipeline
+                plugins: postcssPlugins.dev(fcBuildConfig, { alias: shared.resolve.alias })
               }
             }
           ]
@@ -343,13 +353,13 @@ module.exports = (buildConfig) => (factoryOpts) => {
         rewrites: [{ from: /.*\.html/, to: '/index.html' }]
       },
       publicPath: '/',
-      contentBase: directories.dest,
+      contentBase: pkg.directories.dest,
       stats,
       hot: true
     }
   };
 
-  const staticConfig = {
+  const archive = {
     output: {
       filename: 'tmp/[name].js'
     },
@@ -402,37 +412,37 @@ module.exports = (buildConfig) => (factoryOpts) => {
     ]
   };
 
-    // build-ci mode
+  // build-ci mode
   if (factoryOpts.build && factoryOpts.ci) {
-    return merge(shared, browser, build, ci, entries.ci);
+    return merge(shared, assets, build, ci, { entry: sourceAll(entries.ci) });
 
   // build mode
   } else if (factoryOpts.build) {
     return [
-      merge(shared, browser, build, entries.build),
-      merge(shared, browser, staticConfig, entries.static)
+      merge(shared, assets, build, { entry: sourceAll(entries.build) }),
+      merge(shared, assets, archive, { entry: sourceAll(entries.archive) })
     ];
 
   // production-ci mode
   } else if (factoryOpts.production && factoryOpts.ci) {
-    return merge(shared, browser, build, production, ci, entries.ci);
+    return merge(shared, assets, build, production, ci, { entry: sourceAll(entries.ci) });
 
   // production mode
   } else if (factoryOpts.production) {
     return [
-      merge(shared, browser, build, production, entries.build),
-      merge(shared, browser, staticConfig, entries.static)
+      merge(shared, assets, build, production, { entry: sourceAll(entries.build) }),
+      merge(shared, assets, archive, { entry: sourceAll(entries.archive) })
     ];
 
   // static mode
   } else if (factoryOpts.static) {
-    return merge(shared, browser, staticConfig, entries.static);
+    return merge(shared, assets, archive, { entry: sourceAll(entries.archive) });
 
   // test mode
   } else if (factoryOpts.test) {
     return merge(shared, test);
   }
 
   // dev mode
-  return merge(dev, entries.dev);
+  return merge(dev, { entry: sourceAll(entries.dev) });
 };
diff --git a/fuzzy-chainsaw-build/webpack/dll.factory.js b/fuzzy-chainsaw-build/webpack/dll.factory.js
@@ -12,10 +12,9 @@ const WebpackNotifierPlugin = require('webpack-notifier');
 const stats = require('./lib/webpack-stats');
 
 
-module.exports = (buildConfig) => (factoryOpts) => {
-  const { dest } = buildConfig.lib.pathHelpers;
-  const { outputFormats } = buildConfig.fcConfig;
-  const { dlls } = buildConfig.fcConfig;
+module.exports = (buildConfig) => (factoryOpts = {}) => {
+  const { dest } = buildConfig.pathHelpers;
+  const { dlls, outputDirectories, outputFormats } = buildConfig.fcConfig;
 
   const ciEntry = {
     entry: {
@@ -24,13 +23,11 @@ module.exports = (buildConfig) => (factoryOpts) => {
   };
 
   const allEntry = {
-    entry: {
-      vendor: dlls.vendor,
-      styleguide: dlls.styleguide,
-      tests: dlls.tests
-    }
+    entry: dlls
   };
 
+  const entry = factoryOpts.ci ? ciEntry : allEntry;
+
   const shared = {
     devtool: 'inline-source-map',
     resolve: {
@@ -47,7 +44,7 @@ module.exports = (buildConfig) => (factoryOpts) => {
       'react/lib/ReactContext': true
     },
     output: {
-      path: dest('assets/dlls'),
+      path: dest(outputDirectories.dll),
       filename: outputFormats.dll,
       library: '[name]_dll',
       libraryTarget: 'umd'
@@ -65,9 +62,9 @@ module.exports = (buildConfig) => (factoryOpts) => {
       ]
     },
     plugins: [
-      new CleanWebpackPlugin(['assets/dlls'], { root: dest() }),
+      new CleanWebpackPlugin([outputDirectories.dll], { root: dest() }),
       new webpack.DllPlugin({
-        path: dest('assets/dlls/[name]-manifest.json'),
+        path: dest(`${outputDirectories.dll}/[name]-manifest.json`),
         name: '[name]_dll'
       }),
       new StatsPlugin('dll-stats.json', {
@@ -99,19 +96,11 @@ module.exports = (buildConfig) => (factoryOpts) => {
     ]
   };
 
-  // dll-production-ci mode
-  if (factoryOpts.production && factoryOpts.ci) {
-    return merge(shared, production, ciEntry);
-
-  // dll-production mode
-  } else if (factoryOpts.production) {
-    return merge(shared, production, allEntry);
-
-  // dll-build-ci mode
-  } else if (factoryOpts.ci) {
-    return merge(shared, ciEntry);
+  // dll-production/ci mode
+  if (factoryOpts.production) {
+    return merge({}, shared, production, entry);
   }
 
-  // dll-build mode
-  return merge(shared, allEntry);
+  // dll-build/ci mode
+  return merge({}, shared, entry);
 };
diff --git a/fuzzy-chainsaw-build/webpack/lib/skeleton-html-config.js b/fuzzy-chainsaw-build/webpack/lib/skeleton-html-config.js
diff --git a/fuzzy-chainsaw-build/webpack/workflow/README.md b/fuzzy-chainsaw-build/webpack/workflow/README.md
diff --git a/fuzzy-chainsaw-build/webpack/workflow/browser.js b/fuzzy-chainsaw-build/webpack/workflow/browser.js
diff --git a/fuzzy-chainsaw-build/webpack/workflow/build.js b/fuzzy-chainsaw-build/webpack/workflow/build.js
diff --git a/fuzzy-chainsaw-build/webpack/workflow/config.workflow.factory.js b/fuzzy-chainsaw-build/webpack/workflow/config.workflow.factory.js
diff --git a/fuzzy-chainsaw-build/webpack/workflow/dev.js b/fuzzy-chainsaw-build/webpack/workflow/dev.js
diff --git a/fuzzy-chainsaw-build/webpack/workflow/dll.workflow.factory.js b/fuzzy-chainsaw-build/webpack/workflow/dll.workflow.factory.js
diff --git a/fuzzy-chainsaw-build/webpack/workflow/production.js b/fuzzy-chainsaw-build/webpack/workflow/production.js
diff --git a/fuzzy-chainsaw-build/webpack/workflow/shared.js b/fuzzy-chainsaw-build/webpack/workflow/shared.js
diff --git a/fuzzy-chainsaw-build/webpack/workflow/static.js b/fuzzy-chainsaw-build/webpack/workflow/static.js
diff --git a/fuzzy-chainsaw-build/webpack/workflow/tests.js b/fuzzy-chainsaw-build/webpack/workflow/tests.js
diff --git a/fuzzy-chainsaw-build/yarn.lock b/fuzzy-chainsaw-build/yarn.lock
diff --git a/package.json b/package.json
@@ -25,5 +25,8 @@
     "eslint-plugin-jsx-a11y": "^5.0.1",
     "eslint-plugin-react": "^7.0.1",
     "pre-commit": "^1.2.2"
+  },
+  "devDependencies": {
+    "postcss-import-webpack-resolver": "^1.0.1"
   }
 }
diff --git a/yarn.lock b/yarn.lock
@@ -236,6 +236,21 @@ emoji-regex@^6.1.0:
   version "6.5.1"
   resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-6.5.1.tgz#9baea929b155565c11ea41c6626eaa65cef992c2"
 
+enhanced-resolve@^3.4.1:
+  version "3.4.1"
+  resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-3.4.1.tgz#0421e339fd71419b3da13d129b3979040230476e"
+  dependencies:
+    graceful-fs "^4.1.2"
+    memory-fs "^0.4.0"
+    object-assign "^4.0.1"
+    tapable "^0.2.7"
+
+errno@^0.1.3:
+  version "0.1.4"
+  resolved "https://registry.yarnpkg.com/errno/-/errno-0.1.4.tgz#b896e23a9e5e8ba33871fc996abd3635fc9a1c7d"
+  dependencies:
+    prr "~0.0.0"
+
 error-ex@^1.2.0:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/error-ex/-/error-ex-1.3.1.tgz#f855a86ce61adc4e8621c3cda21e7a7612c3a8dc"
@@ -769,6 +784,13 @@ lru-cache@^4.0.1:
     pseudomap "^1.0.2"
     yallist "^2.1.2"
 
+memory-fs@^0.4.0:
+  version "0.4.1"
+  resolved "https://registry.yarnpkg.com/memory-fs/-/memory-fs-0.4.1.tgz#3a9a20b8462523e447cfbc7e8bb80ed667bfc552"
+  dependencies:
+    errno "^0.1.3"
+    readable-stream "^2.0.1"
+
 minimatch@^3.0.3, minimatch@^3.0.4:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.4.tgz#5166e286457f03306064be5497e8dbb0c3d32083"
@@ -915,6 +937,12 @@ pluralize@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/pluralize/-/pluralize-1.2.1.tgz#d1a21483fd22bb41e58a12fa3421823140897c45"
 
+postcss-import-webpack-resolver@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/postcss-import-webpack-resolver/-/postcss-import-webpack-resolver-1.0.1.tgz#4be0e9400b7609313e11258a17c3c4d7db186ac9"
+  dependencies:
+    enhanced-resolve "^3.4.1"
+
 pre-commit@^1.2.2:
   version "1.2.2"
   resolved "https://registry.yarnpkg.com/pre-commit/-/pre-commit-1.2.2.tgz#dbcee0ee9de7235e57f79c56d7ce94641a69eec6"
@@ -935,6 +963,10 @@ progress@^1.1.8:
   version "1.1.8"
   resolved "https://registry.yarnpkg.com/progress/-/progress-1.1.8.tgz#e260c78f6161cdd9b0e56cc3e0a85de17c7a57be"
 
+prr@~0.0.0:
+  version "0.0.0"
+  resolved "https://registry.yarnpkg.com/prr/-/prr-0.0.0.tgz#1a84b85908325501411853d0081ee3fa86e2926a"
+
 pseudomap@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/pseudomap/-/pseudomap-1.0.2.tgz#f052a28da70e618917ef0a8ac34c1ae5a68286b3"
@@ -954,7 +986,7 @@ read-pkg@^2.0.0:
     normalize-package-data "^2.3.2"
     path-type "^2.0.0"
 
-readable-stream@^2.2.2:
+readable-stream@^2.0.1, readable-stream@^2.2.2:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.3.tgz#368f2512d79f9d46fdfc71349ae7878bbc1eb95c"
   dependencies:
@@ -1131,6 +1163,10 @@ table@^3.7.8:
     slice-ansi "0.0.4"
     string-width "^2.0.0"
 
+tapable@^0.2.7:
+  version "0.2.7"
+  resolved "https://registry.yarnpkg.com/tapable/-/tapable-0.2.7.tgz#e46c0daacbb2b8a98b9b0cea0f4052105817ed5c"
+
 text-table@~0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"