Setting up build for deployment to DE

Author: Paul Gray

.gitignore

@@ -1,3 +1,5 @@
 node_modules/
 
 dist/
+
+*.zip

Gruntfile.js

@@ -29,7 +29,7 @@ module.exports = function (grunt) {
       dist: {
         files: [{
           expand: true,
-          cwd: 'src/',
+          cwd: 'app/',
           src: 'index.html',
           dest: 'dist/'
         }],

app/car.json

@@ -1,12 +1,17 @@
 {
     "identifier": "com.learningobjects.etui",
-    "name": "Administration",
+    "name": "Extended Transcript",
     "version": "1.0.0",
     "components": [{
-        "identifier": "loi.cp.ExtendedTranscriptDomain",
+        "identifier": "loi.cp.ExtendedTranscriptUI",
         "name": "Extended Transcript UI",
-        "description": "Extended Transcript ui",
-        "implementation": "loi.cp.domain.GenericDomain"
+        "description": "View standardized transcripts.",
+        "implementation": "loi.cp.generic.GenericServlet",
+        "annotations": {
+          "com.learningobjects.cpxp.component.web.ServletBinding": {
+            "path": "/extended-transcript"
+          }
+        }
     }],
     "dependencies": [ "com.learningobjects.component" ]
 }

app/components/transcript/transcriptModule.js

@@ -4,10 +4,8 @@ export default angular.module(moduleName, []);
 
 import transcript from './transcript';
 import unit from './unit/unit';
-import unitBar from './unit/unitBar';
 import competency from './competency/competency';
 
-angular.module(moduleName).directive('transcript', transcript); 
+angular.module(moduleName).directive('transcript', transcript);
 angular.module(moduleName).directive('unit', unit);
-angular.module(moduleName).directive('unitBar', unitBar);
 angular.module(moduleName).directive('competency', competency);

index.html app/index.htmlindex.html renamed to app/index.html

@@ -24,8 +24,6 @@
           <header></header>
           <transcript></transcript>
         </div>
-        <!--<script type="text/javascript" src="/dist/assets/main.js"></script>-->
-        <!--<script type="text/javascript" src="$$url/assets/bundle.js"></script>-->
-        <script type="text/javascript" src="/bundle.js"></script>
+        <script type="text/javascript" src="/assets/main.js"></script>
     </body>
 </html>

app/index.js

@@ -4,8 +4,6 @@ import 'angular-ui-router';
 //import 'bootstrap';
 import 'font-awesome/css/font-awesome.css';
 
-import 'copy!./car.json';
-
 //Styles
 import 'bootstrap/dist/css/bootstrap.css';
 import './styles/main.less';

package.json

@@ -1,8 +1,12 @@
 {
-  "name": "campuspack",
+  "name": "extended-transcript",
   "version": "1.0.0",
-  "description": "Social Collaboration",
-  "main": "Gruntfile.js",
+  "description": "Extended Transcript user interface",
+  "src": "app",
+  "test": "test",
+  "dist": "dist",
+  "mainInput": "main",
+  "mainOutput": "main",
   "devDependencies": {
     "babel-core": "^5.6.7",
     "babel-loader": "^5.2.1",

webpack.config.js

@@ -6,7 +6,7 @@ var webpack = require('webpack'),
 // PATHS
 var PATHS = {
   app: __dirname + '/app',
-  target: __dirname + '/dist' //this might be able to be changed... have to check maven.
+  target: __dirname + '/dist'
 };
 
 module.exports = {

webpack.config.js.new

@@ -8,16 +8,23 @@
 
 var webpack = require('webpack');
 
+// PATHS
+var PATHS = {
+  app: __dirname + '/app',
+  target: __dirname + '/dist' //this might be able to be changed... have to check maven.
+};
+
 module.exports = {
 
   output: {
-    path: 'dist/assets/',
-    filename: 'main.js'
+      path: PATHS.target + '/assets',
+      filename: 'main.js',
+      publicPath: '/assets/'
   },
 
   debug: false,
   devtool: false,
-  entry: './src/scripts/components/main.js',
+  entry: './app/index.js',
 
   stats: {
     colors: true,
@@ -43,24 +50,27 @@ module.exports = {
     }],
 
     loaders: [{
-      test: /\.js$/,
-      loader: 'jsx-loader?harmony'
+      test: /\.jsx?$/,
+      loader: 'babel',
+      include: PATHS.app
     }, {
-      test: /\.css$/,
-      loader: 'style-loader!css-loader'
+      test: /\.sass$/,
+      loader: 'style!copy' //the server will compile this for us!
     }, {
-      test: /\.less/,
-      loader: 'style-loader!css-loader!less-loader'
+      test: /\.less$/,
+      loader: 'style!css!less'
     }, {
-      test: /\.(png|jpg)$/,
-      loader: 'url-loader?limit=8192'
+      test: /\.css$/,
+      loader: 'style!css'
     }, {
-      test: /\.(eot.*|woff.*|ttf.*|svg.*)$/,
-      loader: "file-loader"
+      test: /\.(png|jpg)$/,
+      loader: 'url?limit=8192'
     }, {
-      test: /\.jsx?$/,
-      exclude: /node_modules/,
-      loader: "babel-loader"
+      test: /(\.(eot.*|woff.*|ttf.*|svg.*)$|.(gif)$)/,
+      loader: "file"
+    },  {
+      test: /\.html$/,
+      loader: "ngtemplate?relativeTo=" + __dirname + "!html"
     }]
   }
 };