diff --git a/lib/core/config.js b/lib/core/config.js
index 0d290e9e..a71a72ee 100644
--- a/lib/core/config.js
+++ b/lib/core/config.js
@@ -4,9 +4,8 @@ var Plugins = require('./plugins.js');
 var utils = require('../utils/utils.js');
 var Npm = require('../pipeline/npm.js');
 let currentWeb3Version = require('../../package.json').dependencies.web3.replace("^","");
+const webpack = require("webpack");
 
-// TODO: add wrapper for fs so it can also work in the browser
-// can work with both read and save
 var Config = function(options) {
   this.env = options.env;
   this.blockchainConfig = {};
@@ -336,11 +335,55 @@ Config.prototype.loadFiles = function(files) {
     //} else if (file === 'abi.js') {
     //  readFiles.push({filename: file, content: "", path: file});
     } else {
-      if (file.indexOf('.') >= 0)  {
+
+      if (file.indexOf('index.js') >= 0) {
+      //if (file.indexOf('.js') >= 0) {
+        readFiles.push(new File({filename: file, type: "custom", path: file, resolver: function(callback) {
+          console.log("---");
+          console.log(fs.dappPath());
+          console.log(file);
+          console.log("---");
+          webpack({
+            entry: utils.joinPath(fs.dappPath(), file),
+            output: {
+              //libraryTarget: 'umd',
+              path: utils.joinPath(fs.dappPath(), '.embark'),
+              //filename: 'my-first-webpack.bundle.js'
+              filename: file
+            },
+            externals: function(context, request, callback) {
+              if (request == "MyLib") {
+                console.log("MyLib Detected!");
+                return callback(null, "{foo: 'hello'}");
+              }
+              callback();
+            },
+            module: {
+              rules: [
+                {
+                  test: /\.css$/,
+                  use: [
+                    { loader: "style-loader" },
+                    { loader: "css-loader" }
+                  ]
+                }
+              ]
+            }
+          }).run((err, stats) => {
+            console.log(err, stats);
+            //return callback(fs.readFileSync('./.embark/my-first-webpack.bundle.js').toString());
+            return callback(fs.readFileSync('./.embark/' + file).toString());
+          });
+        }}));
+      } else {
         readFiles.push(new File({filename: file, type: "dapp_file", path: file}));
-      } else if (file[0] === '$') {
-        //readFiles.push(new File({filename: file, type: 'embark_internal', path: file}));
       }
+
+      //if (file.indexOf('.') >= 0)  {
+      //  readFiles.push(new File({filename: file, type: "dapp_file", path: file}));
+      //} else if (file[0] === '$') {
+      //  //readFiles.push(new File({filename: file, type: 'embark_internal', path: file}));
+      //}
     }
   });
 
diff --git a/lib/core/fs.js b/lib/core/fs.js
index d61933fa..94a9c9f1 100644
--- a/lib/core/fs.js
+++ b/lib/core/fs.js
@@ -46,5 +46,6 @@ module.exports = {
   readJSONSync: readJSONSync,
   writeJSONSync: writeJSONSync,
   existsSync: existsSync,
-  embarkPath: embarkPath
+  embarkPath: embarkPath,
+  dappPath: dappPath
 };
diff --git a/package.json b/package.json
index efe96126..f5f4258a 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,7 @@
     "chokidar": "^1.6.0",
     "colors": "^1.1.2",
     "commander": "^2.8.1",
+    "css-loader": "^0.28.7",
     "ejs": "^2.5.7",
     "ethereumjs-testrpc": "3.9.2",
     "finalhandler": "^0.5.0",
@@ -37,6 +38,7 @@
     "serve-static": "^1.11.1",
     "shelljs": "^0.5.0",
     "solc": "0.4.17",
+    "style-loader": "^0.19.0",
     "tar": "^3.1.5",
     "toposort": "^1.0.0",
     "underscore": "^1.8.3",
diff --git a/test_app/app/js/foo.css b/test_app/app/js/foo.css
new file mode 100644
index 00000000..c4d554e0
--- /dev/null
+++ b/test_app/app/js/foo.css
@@ -0,0 +1,3 @@
+body {
+  background-color: black;
+}
diff --git a/test_app/app/js/foo.js b/test_app/app/js/foo.js
new file mode 100644
index 00000000..0ab4b0c5
--- /dev/null
+++ b/test_app/app/js/foo.js
@@ -0,0 +1,4 @@
+
+const FOO = "dude";
+
+export default FOO;
diff --git a/test_app/app/js/index.js b/test_app/app/js/index.js
index cbf16091..caa255cb 100644
--- a/test_app/app/js/index.js
+++ b/test_app/app/js/index.js
@@ -1,5 +1,12 @@
 /*globals $, SimpleStorage, document*/
 
+import Test2 from 'MyLib';
+
+import test3 from './foo';
+import './foo.css';
+
+window.test_3 = test3;
+
 var addToLog = function(id, txt) {
   $(id + " .logs").append("<br>" + txt);
 };
@@ -8,6 +15,9 @@ var addToLog = function(id, txt) {
 // Blockchain example
 // ===========================
 $(document).ready(function() {
+  console.log([1,2,3].map(v => v + 1));
+  alert('hello');
+  window.test_2 = Test2;
 
   $("#blockchain button.set").click(function() {
     var value = parseInt($("#blockchain input.text").val(), 10);
diff --git a/test_app/embark.json b/test_app/embark.json
index 2b275be5..2f08464d 100644
--- a/test_app/embark.json
+++ b/test_app/embark.json
@@ -1,9 +1,10 @@
 {
   "contracts": ["app/contracts/**"],
   "app": {
+    "js/webpack_test.js": "app/js/index.js",
     "css/app.css": ["app/css/**"],
     "images/": ["app/images/**"],
-    "js/app.js": ["embark.js", "app/js/_vendor/jquery.min.js", "app/js/_vendor/bootstrap.min.js", "app/js/**", "!app/js/test.js"],
+    "js/app.js": ["embark.js", "app/js/_vendor/jquery.min.js", "app/js/_vendor/bootstrap.min.js", "app/js/**", "!app/js/test.js", "!app/js/foo.js", "!app/js/foo.css"],
     "js/embark.js": ["embark.js"],
     "js/abi.js": "abi.js",
     "js/test.js": ["embark.js", "app/js/_vendor/jquery.min.js", "app/js/_vendor/async.min.js", "app/js/test.js"],