From 75d203c4782ba5e50562e619f8ee1582d7272b5f Mon Sep 17 00:00:00 2001
From: alecmerdler <merdlera@oregonstate.edu>
Date: Mon, 6 Feb 2017 14:05:19 -0800
Subject: [PATCH] update Webpack to 2.2

---
 Dockerfile                                     |  6 ++----
 package.json                                   |  2 +-
 .../components/pages/repo-page/body.tsx        |  6 +++---
 webpack.config.js                              | 18 +++++++++---------
 4 files changed, 15 insertions(+), 17 deletions(-)

diff --git a/Dockerfile b/Dockerfile
index 0657f5af6..2681b48d1 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -77,7 +77,7 @@ RUN chmod +x /usr/local/bin/jwtproxy
 RUN curl -L -o /usr/local/bin/prometheus-aggregator https://github.com/coreos/prometheus-aggregator/releases/download/v0.0.1-alpha/prometheus-aggregator
 RUN chmod +x /usr/local/bin/prometheus-aggregator
 
-# Install Webpack, Typescript, React
+# Install Webpack, Typescript
 RUN ln -s /usr/bin/nodejs /usr/bin/node
 ADD package.json package.json
 ADD tsconfig.json tsconfig.json
@@ -88,11 +88,9 @@ RUN npm link typescript
 
 # Add static files
 ADD static static
-ADD static/js/directives/components static/dist/components
 
 # Run Webpack
-RUN npm install -g webpack
-RUN webpack
+RUN node_modules/.bin/webpack --progress
 
 # Run front-end tests
 ARG RUN_TESTS=true
diff --git a/package.json b/package.json
index 143e082a5..e6cda51ef 100644
--- a/package.json
+++ b/package.json
@@ -59,6 +59,6 @@
     "ts-loader": "0.9.5",
     "typescript": "2.0.3",
     "typings": "1.4.0",
-    "webpack": "1.13.3"
+    "webpack": "^2.2"
   }
 }
diff --git a/static/js/directives/components/pages/repo-page/body.tsx b/static/js/directives/components/pages/repo-page/body.tsx
index a7035bd60..707963252 100644
--- a/static/js/directives/components/pages/repo-page/body.tsx
+++ b/static/js/directives/components/pages/repo-page/body.tsx
@@ -34,7 +34,7 @@ class body extends React.Component<IBody, IBodyState> {
     };
   }
   componentDidMount() {
-    let intervalId: number = setInterval(() => this.getBuilds(), 1000);
+    let intervalId: number = window.setInterval(() => this.getBuilds(), 1000);
     this.setState({
       currentBuild: this.state.currentBuild,
       intervalId: intervalId
@@ -65,7 +65,7 @@ class body extends React.Component<IBody, IBodyState> {
           trigger_metadata: element.trigger_metadata
         });
       });
-      
+
       this.setState({
         currentBuild: builds,
         intervalId: this.state.intervalId
@@ -92,7 +92,7 @@ class body extends React.Component<IBody, IBodyState> {
                   <div className="tab-pane in active" id="tab1">
                     <div className="rp-description">{description}</div>
                   </div>
-                  <div className="tab-pane" id="tab2">                    
+                  <div className="tab-pane" id="tab2">
                     <div className="panel-body">
                       <h3 className="tab-header">Repository Builds</h3>
                         <Build data={this.state.currentBuild}/>
diff --git a/webpack.config.js b/webpack.config.js
index 0e439c03f..788f51445 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -8,17 +8,17 @@ var config = {
     filename: "bundle.js"
   },
   resolve: {
-    extensions: ["", ".ts", ".tsx", ".js", ".scss"],
+    extensions: [".ts", ".tsx", ".js", ".scss"],
     alias: {
-      "sass": path.resolve('./static/css/directives/components/pages/')
+      sass: path.resolve(__dirname, 'static/css/directives/components/pages/')
     }
   },
   // Use window.angular to maintain compatibility with non-Webpack components
   externals: {
-    "angular": "angular",
+    angular: "angular",
   },
   module: {
-    loaders: [
+    rules: [
       {
         test: /\.tsx?$/,
         loader: "ts-loader",
@@ -26,13 +26,13 @@ var config = {
       },
       {
         test: /\.scss$/,
-        loaders: ['style', 'css', 'sass'],
+        use: [
+          "style-loader",
+          "css-loader",
+          "sass-loader",
+        ],
         exclude: /node_modules/
       },
-      {
-        test: /angular\.js$/,
-        loader: 'expose?angular',
-      }
     ]
   },
   devtool: "source-map",