From e8046ced1c2c26820925d371e1948aba1d06ae02 Mon Sep 17 00:00:00 2001
From: Judah Meek <judah.meek@gmail.com>
Date: Thu, 29 Sep 2016 16:16:53 -0500
Subject: [PATCH] Documentation update (#182)

* Add Table of Contents
* Addressed Issue #172

(cherry picked from commit 57abdbad64197d30d0e8c5aed012e8737b908a4f)
---
 README.md    | 63 +++++++++++++++++++++++++++++++++++++++++++++++-----
 package.json |  1 +
 2 files changed, 58 insertions(+), 6 deletions(-)

diff --git a/README.md b/README.md
index 21ad3020..1e6b2b3c 100644
--- a/README.md
+++ b/README.md
@@ -24,6 +24,30 @@ That being said, Bootstrap 4 probably works just fine! You must use `4.0.0-alpha
 2016-08-01: Released 1.1.0. Supports custom bootstraprc location.
 2016-02-28: Released 1.0.9. Updated to support Bootstrap 4, alpha 2!
 
+## Table of Contents
+
++ [Installation](#installation)
++ [Usage](#usage)
+  - [Bootstrap 4 internal dependency solution](#bootstrap-4-internal-dependency-solution)
++ [Examples](#examples)
++ [Common configuration options](#common-configuration-options)
+  - [Bootstrap 3 & 4](#bootstrap-3--4)
+  - [Bootstrap 4 only](#bootstrap-4-only)
+    * [Tether](#tether)
+    * [PostCSS](#postcss)
+    * [Glyphicon alternatives](#glyphicon-alternatives)
++ [Additional configurations](#additional-configurations)
+  - [Paths to custom assets](#paths-to-custom-assets)
+  - [Incorporating Bootswatch themes](#incorporating-bootswatch-themes)
+  - [jQuery](#jquery)
+  - [Icon fonts](#icon-fonts)
++ [FAQ](#faq)
+  - [Using Bootstrap mixins and variables](#using-bootstrap-mixins-and-variables)
++ [Contributing](#contributing)
++ [License](#license)
++ [Examples and related libraries](#examples-and-related-libraries)
++ [Useful Q&A](#useful-qa)
+
 ## Installation
 Get it via npm:
 
@@ -112,6 +136,33 @@ scripts:
 
 If no config provided, default one for Bootstrap 3 will be used.
 
+### Bootstrap 4 internal dependency solution
+
+Because of Bootstrap 4's removal of UMD, internal dependencies, such as Popover's dependencies on Tooltip and Dropdown's dependency on Utils, are no longer naively resolved by Webpack (See Issue [#172](https://github.com/shakacode/bootstrap-loader/issues/172). In order to solve this issue, add the following code to your webpack configuration:
+```
+plugins: [
+  new webpack.ProvidePlugin({
+    $: "jquery",
+    jQuery: "jquery",
+    "window.jQuery": "jquery",
+    Tether: "tether",
+    "window.Tether": "tether",
+    Tooltip: "exports?Tooltip!bootstrap/js/dist/tooltip",
+    Alert: "exports?Alert!bootstrap/js/dist/alert",
+    Button: "exports?Button!bootstrap/js/dist/button",
+    Carousel: "exports?Carousel!bootstrap/js/dist/carousel",
+    Collapse: "exports?Collapse!bootstrap/js/dist/collapse",
+    Dropdown: "exports?Dropdown!bootstrap/js/dist/dropdown",
+    Modal: "exports?Modal!bootstrap/js/dist/modal",
+    Popover: "exports?Popover!bootstrap/js/dist/popover",
+    Scrollspy: "exports?Scrollspy!bootstrap/js/dist/scrollspy",
+    Tab: "exports?Tab!bootstrap/js/dist/tab",
+    Tooltip: "exports?Tooltip!bootstrap/js/dist/tooltip",
+    Util: "exports?Util!bootstrap/js/dist/util",
+  })
+]
+```
+
 ## Examples
 Check out example apps in [`examples/`](examples) folder:
 
@@ -119,10 +170,10 @@ Check out example apps in [`examples/`](examples) folder:
  * See the `npm run bs4:customlocation` tasks for examples on how to pass your .bootstraprc config.
 * With CSS Modules: [examples/css-modules](examples/css-modules) (This example shows off hot reloading with Babel 6 as well!)
 
-## Common Options for Bootstrap 3 and 4
+## Common configuration options
 Here are common options for Bootstrap 3 & 4.
 
-### Bootstrap 3
+### Bootstrap 3 & 4
 
 #### `loglevel`
 
@@ -268,7 +319,7 @@ $icon-font-name: 'glyphicons' // you'll typically want to change this too.
 ```
 
 
-### Bootstrap 4
+### Bootstrap 4 only
 There is only one additional option for Bootstrap 4:
 
 #### `useFlexbox`
@@ -303,7 +354,7 @@ Bootstrap 4 seems to require postcss:
 1. Add postcss and the the postcss-loader: `npm i --save postcss postcss-loader`
 2. Put `postcss` before `sass` in the order of loaders in your `.bootstraprc` file.
 
-#### Glyphicons
+#### Glyphicon alternatives
 Glyphicons have been removed from Bootstrap 4. The examples demonstrate how to use the font-awesome-loader
 
 ## Additional configurations
@@ -381,7 +432,7 @@ module: {
 
 ## FAQ
 
-### Using Bootstrap mixins and variables in your own code
+### Using Bootstrap mixins and variables
 
 You should use `sass-resources-loader` in your `webpack` config.
 
@@ -428,7 +479,7 @@ See [Contributing](CONTRIBUTING.md) to get started.
 ## License
 MIT.
 
-## Example and Related Libraries
+## Examples and related libraries
 * [react-webpack-rails-tutorial](https://github.com/shakacode/react-webpack-rails-tutorial/), live example at [www.reactrails.com](http://www.reactrails.com/).
 * [sass-resources-loader](https://github.com/shakacode/sass-resources-loader/)
 * [Simple integration example](./examples/basic)
diff --git a/package.json b/package.json
index c776eb09..e26ff3da 100644
--- a/package.json
+++ b/package.json
@@ -46,6 +46,7 @@
   "dependencies": {
     "chalk": "^1.1.3",
     "escape-regexp": "0.0.1",
+    "exports-loader": "^0.6.3",
     "js-yaml": "^3.6.1",
     "loader-utils": "^0.2.15",
     "resolve": "^1.1.7",