From 7fe19cb770d891ca508323fc1c722c750629724d Mon Sep 17 00:00:00 2001
From: Guillaume Vincent <guillaume@oslab.fr>
Date: Sat, 13 Feb 2016 13:29:45 +0100
Subject: [PATCH] try to fix css webpack problem

---
 app/app.old.vue                       |  38 +++++++
 app/app.vue                           |  25 +----
 app/components/features.vue           |   9 +-
 app/components/header.vue             | 110 +++++++++----------
 app/components/headlines.vue          |  31 ++++--
 app/components/index.old.vue          |  29 +++++
 app/components/password-generator.vue |  41 ++++---
 app/locales.js                        | 194 ++++++++++++++++++++++++++++++++++
 app/locales/locales.js                | 181 -------------------------------
 app/main.js                           |  56 ++--------
 app/main.old.js                       |  51 +++++++++
 app/router.js                         |  43 ++++++++
 app/services/auth.js                  |   7 +-
 app/services/logging.js               |   9 +-
 index.html                            |   2 +-
 package.json                          |  25 ++---
 webpack.config.js                     |  67 ++++--------
 webpack.config.old.js                 |  86 +++++++++++++++
 18 files changed, 602 insertions(+), 402 deletions(-)
 create mode 100644 app/app.old.vue
 create mode 100644 app/components/index.old.vue
 create mode 100644 app/locales.js
 delete mode 100644 app/locales/locales.js
 create mode 100644 app/main.old.js
 create mode 100644 app/router.js
 create mode 100644 webpack.config.old.js

diff --git a/app/app.old.vue b/app/app.old.vue
new file mode 100644
index 0000000..a9232a6
--- /dev/null
+++ b/app/app.old.vue
@@ -0,0 +1,38 @@
+<style>
+    #toast-container > div {
+        opacity: 1;
+        -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+        filter: alpha(opacity=100);
+    }
+
+    body {
+        font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
+        font-size: 14px;
+        line-height: 1.4;
+        background: #D3D8E8;
+        color: #252830;
+    }
+
+    .blue {
+        color: #0275D8;
+    }
+</style>
+
+<template>
+    <div>
+        <lesspass-header></lesspass-header>
+        <router-view></router-view>
+    </div>
+</template>
+<script>
+    import LesspassHeader from './components/header.vue';
+
+    export default {
+        data: function () {
+            return {}
+        },
+        components: {
+            LesspassHeader
+        }
+    }
+</script>
\ No newline at end of file
diff --git a/app/app.vue b/app/app.vue
index 5b090de..5a7d1b4 100644
--- a/app/app.vue
+++ b/app/app.vue
@@ -1,19 +1,10 @@
 <style>
-    @import '../node_modules/bootstrap/dist/css/bootstrap.css';
-    @import '../node_modules/toastr/build/toastr.min.css';
-
-    #toast-container > div {
-        opacity: 1;
-        -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
-        filter: alpha(opacity=100);
-    }
-
     body {
         font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
         font-size: 14px;
-        line-height: 1.5;
-        color: #cfd2da;
-        background-color: #252830;
+        line-height: 1.4;
+        background: #D3D8E8;
+        color: #252830;
     }
 
     .blue {
@@ -22,19 +13,13 @@
 </style>
 
 <template>
-    <div>
+    <div id="App">
         <lesspass-header></lesspass-header>
         <router-view></router-view>
     </div>
 </template>
 <script>
-    var $ = require('jquery');
-    window.jQuery = $;
-    window.Tether = require('tether');
-    window.$ = $;
-    var bootstrap = require('bootstrap/dist/js/umd/collapse.js');
-
-    import LesspassHeader from './components/header.vue';
+    var LesspassHeader = require('./components/header.vue');
 
     export default {
         data: function () {
diff --git a/app/components/features.vue b/app/components/features.vue
index 0622a4f..b09def9 100644
--- a/app/components/features.vue
+++ b/app/components/features.vue
@@ -1,13 +1,14 @@
 <style>
     .lesspass-features {
         background-color: #0275D8;
+        color: #D3D8E8;
     }
 
     .lesspass-features ul {
         line-height: 1.8em;
         font-size: 1.15em;
-        margin: 0px auto;
-        padding: 0px;
+        margin: 0 auto;
+        padding: 0;
         list-style-type: none;
     }
 
@@ -23,11 +24,11 @@
     }
 </style>
 <template>
-    <div class="lesspass-features p-y-3 m-t-2">
+    <div class="lesspass-features p-y-3">
         <div class="container">
             <div class="row">
                 <div class="col-lg-8 col-lg-offset-2">
-                    <h2>{{ $t('features.you_should_use_lesspass') }}</h2>
+                    <h3>{{ $t('features.you_should_use_lesspass') }}</h3>
                     <ul>
                         <li>{{{ $t('features.unique_password') }}}&nbsp;;</li>
                         <li>{{{ $t('features.love_open_source') }}}&nbsp;;</li>
diff --git a/app/components/header.vue b/app/components/header.vue
index 8b83bc8..219a4d6 100644
--- a/app/components/header.vue
+++ b/app/components/header.vue
@@ -1,85 +1,73 @@
 <style>
-    .header {
-        background-color: #D8E4EA;
+    #navbar {
         height: 86px;
-    }
-
-    .header {
-        color: #252830;
-    }
-
-    .navbar {
         padding: 1.5rem 0;
     }
 </style>
 <template>
-    <div class="collapse" id="SignInCollapseNavbar">
-        <div class="bg-inverse p-a-1">
-            <div class="container">
-                <div class="col-lg-12">
-                    <form class="form-inline pull-md-right">
-                        <div class="form-group form">
+    <div id="header">
+        <div id="SignInCollapseNavbar" class="bg-inverse collapse">
+            <div class="container p-t-1">
+                <form>
+                    <div class="form-group row">
+                        <div class="col-lg-2 col-lg-offset-4 m-b-1">
                             <label class="sr-only" for="email">{{$t('header.Email')}}</label>
                             <input type="email" class="form-control form-control-sm" id="email"
                                    placeholder="{{$t('header.Email')}}"
                                    v-model="credentials.email">
                         </div>
-                        <div class="form-group">
+                        <div class="col-lg-2 m-b-1">
                             <label class="sr-only" for="password">{{$t('header.Password')}}</label>
                             <input type="password" class="form-control form-control-sm" id="password"
                                    placeholder="{{$t('header.Password')}}"
                                    v-model="credentials.password">
                         </div>
-                        <div class="form-group row">
-                            <div class="col-lg-12">
-                                <button type="submit" class="btn btn-primary btn-sm btn-block" @click="signin()">
-                                    {{$t('header.Sign_in')}}
-                                </button>
-                            </div>
+                        <div class="col-lg-2 m-b-1">
+                            <button type="submit" class="btn btn-primary btn-sm btn-block" @click="signin()">
+                                {{$t('header.Sign_in')}}
+                            </button>
                         </div>
-                        <div class="form-group row">
-                            <div class="col-lg-12">
-                                <button type="submit" class="btn btn-primary-outline btn-sm btn-block"
-                                        @click="register()">
-                                    {{$t('header.Register')}}
-                                </button>
-                            </div>
+                        <div class="col-lg-2 m-b-1">
+                            <button type="submit" class="btn btn-primary-outline btn-sm btn-block"
+                                    @click="register()">
+                                {{$t('header.Register')}}
+                            </button>
                         </div>
-                    </form>
-                </div>
+                    </div>
+                </form>
             </div>
         </div>
-    </div>
-    <div class="header">
-        <nav class="navbar">
-            <div class="container">
-                <ul class="nav navbar-nav">
-                    <li class="nav-item">
-                        <a class="" href="#">
-                            <img src="../assets/images/logo_text.png" alt="logo">
-                        </a>
-                    </li>
-                </ul>
-                <ul class="nav navbar-nav pull-xs-right">
-                    <li class="nav-item" v-if="!user.authenticated">
-                        <button class="navbar-toggler" type="button" data-toggle="collapse"
-                                data-target="#SignInCollapseNavbar">
-                            &#9776;
-                        </button>
-                    </li>
-                    <li class="nav-item" v-if="user.authenticated">
-                        <a class="btn btn-primary" @click="logout()">
-                            logout
-                        </a>
-                    </li>
-                </ul>
-            </div>
-        </nav>
+        <div class="container">
+            <nav id="navbar" class="navbar">
+                <div class="container">
+                    <ul class="nav navbar-nav">
+                        <li class="nav-item">
+                            <a class="" href="#">
+                                <img src="../assets/images/logo_text.png" alt="logo">
+                            </a>
+                        </li>
+                    </ul>
+                    <!--<ul class="nav navbar-nav pull-xs-right">
+                        <li class="nav-item" v-if="!user.authenticated">
+                            <button class="navbar-toggler" type="button" data-toggle="collapse"
+                                    data-target="#SignInCollapseNavbar">
+                                &#9776;
+                            </button>
+                        </li>
+                        <li class="nav-item" v-if="user.authenticated">
+                            <a class="btn btn-primary" @click="logout()">
+                                logout
+                            </a>
+                        </li>
+                    </ul>-->
+                </div>
+            </nav>
+        </div>
     </div>
 </template>
 <script>
-    import auth from '../services/auth'
-    import {router} from '../main'
+    var auth = require('../services/auth.js');
+    var router = require('../router.js');
 
     export default {
         data: function () {
@@ -98,7 +86,7 @@
                     email: this.credentials.email,
                     password: this.credentials.password
                 };
-                auth.login(this, credentials, function(){
+                auth.login(this, credentials, function () {
                     $('#SignInCollapseNavbar').collapse('hide');
                     router.go('/');
                 });
@@ -111,7 +99,7 @@
                 auth.register(this, credentials)
             },
             logout() {
-                auth.logout(function(){
+                auth.logout(function () {
                     router.go('/presentation/');
                 })
             }
diff --git a/app/components/headlines.vue b/app/components/headlines.vue
index efedc8f..2ef792d 100644
--- a/app/components/headlines.vue
+++ b/app/components/headlines.vue
@@ -1,30 +1,39 @@
 <style>
-    .headlines {
-        color: #252830;
-        background-color: #D8E4EA;
-        padding: 5em 0 7em;
-    }
 
     .headlines .title {
-        font-size: 1.5rem;
+        font-size: 1.4rem;
     }
 
     .headlines .subtitle {
-        font-size: 1.3rem;
+        font-size: 1.2rem;
     }
 
     @media (min-width: 550px) {
+        .headlines {
+            padding: 1em 0 3em;
+        }
+
         .headlines .title {
-            font-size: 2.5rem;
+            margin-top: 1em;
+            font-size: 2.3rem;
         }
     }
 </style>
 <template>
-    <section class="headlines text-xs-center">
+    <section class="headlines">
         <div class="container">
-            <div class="col-lg-10 col-lg-offset-1">
+            <div class="col-lg-6 hidden-xs-down">
+                <div v-if="$t('lang') == 'en'">
+                    <img src="../assets/images/story-en.png" class="img-fluid" alt="what is lesspass"/>
+                </div>
+                <div v-if="$t('lang') == 'fr'">
+                    <img src="../assets/images/story-fr.png" class="img-fluid" alt="qu'est ce que lesspass"/>
+                </div>
+                <small>&copy; Nanou</small>
+            </div>
+            <div class="col-lg-6 m-t-3">
                 <h2 class="title text-primary">{{{ $t('header.title') }}}</h2>
-                <h4 class="subtitle hidden-xs-down">
+                <h4 class="subtitle">
                     <span class="text-primary"> LessPass</span> {{ $t('header.subtitle') }}
                 </h4>
             </div>
diff --git a/app/components/index.old.vue b/app/components/index.old.vue
new file mode 100644
index 0000000..7346262
--- /dev/null
+++ b/app/components/index.old.vue
@@ -0,0 +1,29 @@
+<template>
+    <lesspass-headlines></lesspass-headlines>
+    <password-generator></password-generator>
+    <lesspass-features></lesspass-features>
+    <lesspass-faq></lesspass-faq>
+    <lesspass-footer></lesspass-footer>
+</template>
+
+
+<script>
+    import LesspassHeadlines from './headlines.vue';
+    import PasswordGenerator from './password-generator.vue';
+    import LesspassFeatures from './features.vue';
+    import LesspassFaq from './faq.vue';
+    import LesspassFooter from './footer.vue';
+
+    export default {
+        data: function () {
+            return {}
+        },
+        components: {
+            LesspassHeadlines,
+            PasswordGenerator,
+            LesspassFeatures,
+            LesspassFaq,
+            LesspassFooter
+        }
+    }
+</script>
diff --git a/app/components/password-generator.vue b/app/components/password-generator.vue
index 100a278..841e947 100644
--- a/app/components/password-generator.vue
+++ b/app/components/password-generator.vue
@@ -1,6 +1,8 @@
 <template>
-    <div id="password-generator" class="container m-y-3">
-        <form>
+    <div id="password-generator" class="container p-y-3">
+        <div class="row">
+            <div class="col-lg-12">
+                            <form>
             <div class="form-group row">
                 <div class="col-lg-3 m-t-1">
                     <label for="pg-email" class="sr-only">
@@ -18,12 +20,17 @@
                     <label for="pg-masterpassword" class="sr-only">
                         {{ $t('passwordgenerator.password') }}
                     </label>
-                    <input id="pg-masterpassword"
-                           class="form-control"
-                           type="password"
-                           placeholder="{{ $t('passwordgenerator.password') }}"
-                           v-model="password"
-                           v-on:blur="updateMasterPassword">
+                    <div class="input-group">
+                        <input id="pg-masterpassword"
+                               class="form-control"
+                               type="password"
+                               placeholder="{{ $t('passwordgenerator.password') }}"
+                               v-model="password"
+                               v-on:blur="updateMasterPassword">
+                        <span class="input-group-btn" @click="changeType('pg-masterpassword')">
+                            <button class="btn btn-secondary" type="button"><i class="fa fa-eye"></i></button>
+                        </span>
+                    </div>
                 </div>
                 <div class="col-lg-3 m-t-1">
                     <label for="pg-site" class="sr-only">
@@ -78,7 +85,8 @@
                             </div>
                             <div class="col-lg-3">
                                 <label class="c-input c-checkbox">
-                                    <input type="checkbox" id="numbers" value="numbers" v-model="passwordInfo.settings"
+                                    <input type="checkbox" id="numbers" value="numbers"
+                                           v-model="passwordInfo.settings"
                                            checked>
                                     <span class="c-indicator"></span>
                                     {{ $t('passwordgenerator.numbers_options') }}
@@ -86,7 +94,8 @@
                             </div>
                             <div class="col-lg-3">
                                 <label class="c-input c-checkbox">
-                                    <input type="checkbox" id="symbols" value="symbols" v-model="passwordInfo.settings"
+                                    <input type="checkbox" id="symbols" value="symbols"
+                                           v-model="passwordInfo.settings"
                                            checked>
                                     <span class="c-indicator"></span>
                                     {{ $t('passwordgenerator.symbols_options') }}
@@ -125,12 +134,13 @@
                 </div>
             </div>
         </form>
+            </div>
+        </div>
     </div>
 </template>
 
 <script>
     import Lesspass from '../lesspass'
-
     import Clipboard from 'clipboard';
 
     export default {
@@ -154,9 +164,16 @@
                 var password = this.password;
                 if (email && password) {
                     Lesspass.createMasterPassword(email, password).then(function (masterPassword) {
-                        self.$set('masterPassword', masterPassword)
+                        self.$set('masterPassword', masterPassword);
                     });
                 }
+            },
+            changeType: function (id) {
+                if (document.getElementById(id).type == 'password') {
+                    document.getElementById(id).type = 'text'
+                } else {
+                    document.getElementById(id).type = 'password'
+                }
             }
         },
         computed: {
diff --git a/app/locales.js b/app/locales.js
new file mode 100644
index 0000000..291102c
--- /dev/null
+++ b/app/locales.js
@@ -0,0 +1,194 @@
+var I18n = require('vue-i18n');
+var Vue = require('vue');
+
+const locales = {
+    "en": {
+        "lang": "en",
+        "header": {
+            "Email": "Email",
+            "Password": "Password",
+            "Sign_in": "Sign_in",
+            "Register": "Register",
+            "title": "Next generation<br>password manager",
+            "subtitle": "replaces all your tools that record your passwords as LastPass, 1Password, Keepass, Excel spreadsheet, post it, etc ..."
+        },
+        "headlines": {
+            "title": "Next generation password manager",
+            "subtitle": "LessPass does not store passwords, and neither should you !"
+        },
+        "jumbotron": {
+            "what_is_lesspass": "replaces all your tools that record your passwords as LastPass, 1Password, Keepass, Excel spreadsheet, post it, etc ...",
+            "what_is_lesspass2": "regenerates your passwords when you need them. Each password is unique to each site. All you need is to remember a single password.",
+            "use_btn": "use LessPass"
+        },
+        "footer": {
+            "built_by": "by",
+            "source_code": "Source code"
+        },
+        "features": {
+            "you_should_use_lesspass": "Why should you use LessPass?",
+            "unique_password": "you want a <strong>unique password</strong> for each site",
+            "love_open_source": "you love <strong>open-source</strong>",
+            "works_everywhere": "you want a manager that <strong>works everywhere</strong> (computer, smartphone, tablet and your smartTV)",
+            "no_cloud": "you <strong>don't want to store</strong> your passwords",
+            "only_one_password": "you want to <strong>remember only one</strong> password"
+        },
+        "passwordgenerator": {
+            "email": "Email",
+            "password": "Password",
+            "unique_password": "Unique password",
+            "site": "Web site",
+            "site_placeholder": "Site (ex: Facebook)",
+            "copy": "Copy",
+            "advanced_options": "Advanced options",
+            "lowercase_options": "lowercase (a-z)",
+            "uppercase_options": "UPPERCASE (A-Z)",
+            "numbers_options": "numbers (0-9)",
+            "symbols_options": "symbols (@&%?)",
+            "counter": "Counter",
+            "generated_password": "Generated password",
+            "length": "Length"
+        },
+        "faq": {
+            "q_works_in_future": "Will LessPass works in the future?",
+            "a_works_in_future": "Hosting, domain's name and SSL certificate have been <strong>pre-paid until February 2017</strong>.",
+            "q_trust": "I don't trust password manager such as LastPass or 1Password, why should LessPass be any different?",
+            "a_trust_we": "<strong>Neither do we</strong>. Hence our approach",
+            "a_trust_oss": "unlike other services LessPass is <strong>open-source</strong>. So its security can be audited",
+            "a_trust_code": "code is a <a href='https://github.com/oslab-fr/lesspass'>available on Github</a> so you can <strong>install it on your own</strong> computer or corporate server",
+            "a_trust_tracking": "we don't like being tracked, so <strong>NO third-parties</strong> are used site/app (e.g. no <i>Google Analytics</i>, <i>Facebook</i>, etc.)",
+            "a_trust_client_side": "password generation is your business thus done <strong>entirely client-side</strong>",
+            "a_trust_online": "<em>online mode</em> is here to suggest <var>email</var> and <var>site</var>, <i>i.e.</i> store only that",
+            "source_code": "Audit source code",
+            "q_make_it_safer": "How can I make LessPass even safer?",
+            "a_make_it_safer_private": "Use the <strong><a href='https://en.wikipedia.org/wiki/Privacy_mode'>privacy mode</a></strong> of your browser and close when you're done.",
+            "a_make_it_safer_update": "Also, keep your browser up-to-date (this one is obvious).",
+            "q_roadmap": "What is the roadmap for future versions?",
+            "a_roadmap_preset_saving": "<strong>Reduce cognitive load</strong> by saving generation settings in your account, so <var>email</var>, <var>site</var> and <var>ruleset</var> will be stored but not the <var>password</var>.",
+            "a_roadmap_15min_memory": "<strong>improve security</strong> by removing password after 15 minutes of inactivity",
+            "a_roadmap_offline_mode": "full offline mode",
+            "q_password_generation": "Where are the passwords generated?",
+            "a_password_generation": "Generation is performed <strong>on your computer by your browser</strong> and never stored as they never reach LessPass servers (or any others).",
+            "q_pricing": "Is LessPass free?",
+            "a_pricing_free": "LessPass is free and always will be.",
+            "a_pricing_enterprise": "LessPass Enterprise will add support for <abbr title='Lightweight Directory Access Protocol'>LDAP</abbr> and double-authentication for companies."
+        },
+        "login": {
+            "login": "login",
+            "Login": "Log In",
+            "register": "register",
+            "Register": "Register",
+            "why": "Manage your sites with online mode",
+            "enter_email": "Enter your email",
+            "enter_password": "Enter your password",
+            "lets_go": "Let's go !",
+            "dont_have_an_account": "Don't have an account ?",
+            "already_have_an_account": "Already have an account ?",
+            "create_account": "Create an account",
+            "welcome": "Login successful, welcome on LessPass",
+            "credentials_invalids": "The email address or password you entered is not valid."
+        },
+        "register": {
+            "beta": "Registration for LessPass Entreprise is not yet possible.<br><a href='mailto:contact@oslab.fr?subject=Invitation%20to%20LessPass&body=Hello%0d%0acan%20you%20send%20me%20an%20invitation%20for%20LessPass%20Entreprise%20?%0d%0aThank%20you'><b>Ask your invite here</b></a>"
+        }
+    },
+    "fr": {
+        "lang": "fr",
+        "header": {
+            "Email": "Email",
+            "Password": "Mot de passe",
+            "Sign_in": "Connexion",
+            "Register": "S'enregistrer",
+            "title": "Gestionnaire de mot de passe nouvelle génération",
+            "subtitle": "remplace tous vos outils qui sauvegardent vos mots de passe comme Lastpass, 1password, Keepass, tableur Excel, post it, etc..."
+        },
+        "headlines": {
+            "title": "Gestionnaire de mot de passe nouvelle génération",
+            "subtitle": "LessPass ne mémorise pas vos mots de passe, et vous non plus !"
+        },
+        "jumbotron": {
+            "what_is_lesspass": "remplace tous vos outils qui sauvegardent vos mots de passe comme Lastpass, 1password, Keepass, tableur Excel, post it, etc...",
+            "what_is_lesspass2": "régénère vos mots de passe à chaque fois que vous en avez besoin. Chaque mot de passe est unique et propre à chaque site. Tout ce dont vous avez besoin c'est de vous souvenir d'un seul mot de passe.",
+            "use_btn": "utilisez LessPass"
+        },
+        "footer": {
+            "built_by": "Réalisé par",
+            "source_code": "Code source"
+        },
+        "features": {
+            "you_should_use_lesspass": "Pourquoi utiliser LessPass ?",
+            "unique_password": "vous voulez un <strong>mot de passe unique</strong> pour chaque site",
+            "love_open_source": "vous aimez l'<strong>open-source</strong>",
+            "works_everywhere": "vous voulez une application qui <strong>fonctionne partout</strong> (ordinateur, smartphone, tablette et smartTV)",
+            "no_cloud": "vous ne <strong>voulez pas stocker vos mots de passe</strong>",
+            "only_one_password": "vous voulez <strong>retenir un seul</strong> mot de passe"
+        },
+        "passwordgenerator": {
+            "email": "Email",
+            "password": "Mot de passe",
+            "unique_password": "Mot de passe unique",
+            "site": "Site",
+            "site_placeholder": "Site (ex: Facebook)",
+            "copy": "Copier",
+            "advanced_options": "Options avancées",
+            "lowercase_options": "minuscules (a-z)",
+            "uppercase_options": "MAJUSCULES (A-Z)",
+            "numbers_options": "nombres (0-9)",
+            "symbols_options": "caractères spéciaux (@&%?)",
+            "counter": "Compteur",
+            "generated_password": "Mot de passe généré",
+            "length": "Longueur"
+        },
+        "faq": {
+            "q_works_in_future": "Est ce que LessPass fonctionnera encore demain ?",
+            "a_works_in_future": "Vous nous posez souvent la question de la pérennité de LessPass. Rassurez-vous, LessPass ne coûte pas grand chose. L'hébergement, le nom de domaine et le certificat HTTPS sont déjà provisionnés jusqu'en février 2017.",
+            "q_trust": "Je ne fais pas confiance à LastPass ou 1password, pourquoi je ferais confiance à LessPass ?",
+            "a_trust_lesspass": "Contrairement aux autres services, LessPass est open source donc le code source peut être réutilisé, consulté et audité. Vous pouvez sauvegarder LessPass sur votre ordinateur ou votre serveur d’enterprise gratuitement. Ah et LessPass n'est connecté à aucun service externe (Google Analytics, Facebook, Twitter, etc..). Personne ne sait à part nous que vous utilisez LessPass.",
+            "a_trust_we": "<strong>Nous ne vous demandons pas de nous faire confiance</strong>. D'où notre approche",
+            "a_trust_oss": "À la différence d'autres services, LessPass est <strong>open-source</strong>. De ce fait il peut être –réellement– audité",
+            "a_trust_code": "Le code source est <a href='https://github.com/oslab-fr/lesspass'>disponible sur Github</a>, vous pouvez donc l'<strong>installer sur votre poste</strong> ou un serveur d'entreprise",
+            "a_trust_tracking": "Nous nous opposons au fichage systématique, et par conséquent <strong>aucun outils d'analyse</strong> n'est utilisé dans l'appli ou le site (ex: pas de <i>Google Analytics</i>, <i>Facebook</i>, etc.)",
+            "a_trust_client_side": "La génération des mots de passe doit rester sous votre controle, elle se fait sur votre <strong>navigateur</strong>",
+            "a_trust_online": "<em>le mode connecté</em> a pour but de suggérer vos <var>email</var>s et <var>site</var>s, <i>c.-à-d.</i> qu'il ne stocke rien d'autre",
+            "source_code": "Auditez le code source",
+            "q_make_it_safer": "Comment puis-je rendre LessPass encore plus sûr ?",
+            "a_make_it_safer_private": "Utilisez la <strong><a href='https://fr.wikipedia.org/wiki/Navigation_priv%C3%A9e'>navigation privé</a></strong> de votre navigateur</strong> et fermez le quand vous avez terminé.",
+            "a_make_it_safer_update": "Garder votre navigateur à jour (ce qui corrige les bugs de sécurité).",
+            "q_roadmap": "Quelles fonctionnalités sont prévues pour les versions à venir ?",
+            "a_roadmap_preset_saving": "application connecté pour sauvegarder les informations sur les sites",
+            "a_roadmap_15min_memory": "suppression du mot de passe après 15 minutes d’inactivités",
+            "a_roadmap_offline_mode": "enregistrement des sites en mode déconnecté",
+            "q_password_generation": "Où sont générés les mots de passe ?",
+            "a_password_generation": "La génération du mot de passe est effectué sur votre navigateur et pas sur les serveurs de LessPass.",
+            "q_pricing": "Est ce que LessPass est gratuit ?",
+            "a_pricing_free": "LessPass est gratuit et le sera toujours.",
+            "a_pricing_enterprise": "LessPass Enterprise, avec le support <abbr title='Lightweight Directory Access Protocol'>LDAP</abbr> et la double authentication, sera payante pour les enterprises."
+        },
+        "login": {
+            "login": "Connectez-vous",
+            "register": "S'enregistrer",
+            "why": "Gérez vos mots de passe avec le mode connecté",
+            "enter_email": "Entrez votre email",
+            "enter_password": "Entrez votre mot de passe",
+            "lets_go": "C'est parti !",
+            "dont_have_an_account": "Vous n'avez pas encore de compte ?",
+            "already_have_an_account": "Vous avez déjà un compte ?",
+            "create_account": "Créez un compte",
+            "welcome": "Connexion réussie, bienvenue sur LessPass",
+            "credentials_invalids": "L' adresse e-mail et/ou mot de passe sont invalides"
+        },
+        "register": {
+            "beta": "L'inscription à LessPass Entreprise n'est pas encore possible.<br><a href='mailto:contact@oslab.fr?subject=Invitation%20à%20LessPass&body=Bonjour%0d%0apouvez-vous%20me%20faire%20parvenir%20une%20invitation%20pour%20LessPass%20Entreprise%20?%0d%0aMerci'><b>Demandez une invitation</b></a>"
+        }
+    }
+};
+
+
+var browserLanguage = (navigator.language || navigator.browserLanguage).split('-')[0];
+var lang = browserLanguage in locales ? browserLanguage : 'en';
+Vue.use(I18n, {
+    lang: lang,
+    locales: locales
+});
+
+module.exports = locales;
diff --git a/app/locales/locales.js b/app/locales/locales.js
deleted file mode 100644
index 0e7cc01..0000000
--- a/app/locales/locales.js
+++ /dev/null
@@ -1,181 +0,0 @@
-const locales = {
-    "en": {
-        "lang": "en",
-        "header": {
-            "Email": "Email",
-            "Password": "Password",
-            "Sign_in": "Sign_in",
-            "Register": "Register",
-            "title": "Next generation<br>password manager",
-            "subtitle": "replaces all your tools that record your passwords as LastPass, 1Password, Keepass, Excel spreadsheet, post it, etc ..."
-        },
-        "headlines": {
-            "title": "Next generation password manager",
-            "subtitle": "LessPass does not store passwords, and neither should you !"
-        },
-        "jumbotron": {
-            "what_is_lesspass": "replaces all your tools that record your passwords as LastPass, 1Password, Keepass, Excel spreadsheet, post it, etc ...",
-            "what_is_lesspass2": "regenerates your passwords when you need them. Each password is unique to each site. All you need is to remember a single password.",
-            "use_btn": "use LessPass"
-        },
-        "footer": {
-            "built_by": "by",
-            "source_code": "Source code"
-        },
-        "features": {
-            "you_should_use_lesspass": "Why should you use LessPass?",
-            "unique_password": "you want a <strong>unique password</strong> for each site",
-            "love_open_source": "you love <strong>open-source</strong>",
-            "works_everywhere": "you want a manager that <strong>works everywhere</strong> (computer, smartphone, tablet and your smartTV)",
-            "no_cloud": "you <strong>don't want to store</strong> your passwords",
-            "only_one_password": "you want to <strong>remember only one</strong> password"
-        },
-        "passwordgenerator": {
-            "email": "Email",
-            "password": "Password",
-            "unique_password": "Unique password",
-            "site": "Web site",
-            "site_placeholder": "Site (ex: Facebook)",
-            "copy": "Copy",
-            "advanced_options": "Advanced options",
-            "lowercase_options": "lowercase (a-z)",
-            "uppercase_options": "UPPERCASE (A-Z)",
-            "numbers_options": "numbers (0-9)",
-            "symbols_options": "symbols (@&%?)",
-            "counter": "Counter",
-            "generated_password": "Generated password",
-            "length": "Length"
-        },
-        "faq": {
-            "q_works_in_future": "Will LessPass works in the future?",
-            "a_works_in_future": "Hosting, domain's name and SSL certificate have been <strong>pre-paid until February 2017</strong>.",
-            "q_trust": "I don't trust password manager such as LastPass or 1Password, why should LessPass be any different?",
-            "a_trust_we": "<strong>Neither do we</strong>. Hence our approach",
-            "a_trust_oss": "unlike other services LessPass is <strong>open-source</strong>. So its security can be audited",
-            "a_trust_code": "code is a <a href='https://github.com/oslab-fr/lesspass'>available on Github</a> so you can <strong>install it on your own</strong> computer or corporate server",
-            "a_trust_tracking": "we don't like being tracked, so <strong>NO third-parties</strong> are used site/app (e.g. no <i>Google Analytics</i>, <i>Facebook</i>, etc.)",
-            "a_trust_client_side": "password generation is your business thus done <strong>entirely client-side</strong>",
-            "a_trust_online": "<em>online mode</em> is here to suggest <var>email</var> and <var>site</var>, <i>i.e.</i> store only that",
-            "source_code": "Audit source code",
-            "q_make_it_safer": "How can I make LessPass even safer?",
-            "a_make_it_safer_private": "Use the <strong><a href='https://en.wikipedia.org/wiki/Privacy_mode'>privacy mode</a></strong> of your browser and close when you're done.",
-            "a_make_it_safer_update": "Also, keep your browser up-to-date (this one is obvious).",
-            "q_roadmap": "What is the roadmap for future versions?",
-            "a_roadmap_preset_saving": "<strong>Reduce cognitive load</strong> by saving generation settings in your account, so <var>email</var>, <var>site</var> and <var>ruleset</var> will be stored but not the <var>password</var>.",
-            "a_roadmap_15min_memory": "<strong>improve security</strong> by removing password after 15 minutes of inactivity",
-            "a_roadmap_offline_mode": "full offline mode",
-            "q_password_generation": "Where are the passwords generated?",
-            "a_password_generation": "Generation is performed <strong>on your computer by your browser</strong> and never stored as they never reach LessPass servers (or any others).",
-            "q_pricing": "Is LessPass free?",
-            "a_pricing_free": "LessPass is free and always will be.",
-            "a_pricing_enterprise": "LessPass Enterprise will add support for <abbr title='Lightweight Directory Access Protocol'>LDAP</abbr> and double-authentication for companies."
-        },
-        "login": {
-            "login": "login",
-            "Login": "Log In",
-            "register": "register",
-            "Register": "Register",
-            "why": "Manage your sites with online mode",
-            "enter_email": "Enter your email",
-            "enter_password": "Enter your password",
-            "lets_go": "Let's go !",
-            "dont_have_an_account": "Don't have an account ?",
-            "already_have_an_account": "Already have an account ?",
-            "create_account": "Create an account",
-            "welcome": "Login successful, welcome on LessPass",
-            "credentials_invalids": "The email address or password you entered is not valid."
-        }
-    },
-    "fr": {
-        "lang": "fr",
-        "header": {
-            "Email": "Email",
-            "Password": "Mot de passe",
-            "Sign_in": "Connexion",
-            "Register": "S'enregistrer",
-            "title": "Gestionnaire de mot de passe nouvelle génération",
-            "subtitle": "remplace tous vos outils qui sauvegardent vos mots de passe comme Lastpass, 1password, Keepass, tableur Excel, post it, etc..."
-        },
-        "headlines": {
-            "title": "Gestionnaire de mot de passe nouvelle génération",
-            "subtitle": "LessPass ne mémorise pas vos mots de passe, et vous non plus !"
-        },
-        "jumbotron": {
-            "what_is_lesspass": "remplace tous vos outils qui sauvegardent vos mots de passe comme Lastpass, 1password, Keepass, tableur Excel, post it, etc...",
-            "what_is_lesspass2": "régénère vos mots de passe à chaque fois que vous en avez besoin. Chaque mot de passe est unique et propre à chaque site. Tout ce dont vous avez besoin c'est de vous souvenir d'un seul mot de passe.",
-            "use_btn": "utilisez LessPass"
-        },
-        "footer": {
-            "built_by": "Réalisé par",
-            "source_code": "Code source"
-        },
-        "features": {
-            "you_should_use_lesspass": "Pourquoi utiliser LessPass ?",
-            "unique_password": "vous voulez un <strong>mot de passe unique</strong> pour chaque site",
-            "love_open_source": "vous aimez l'<strong>open-source</strong>",
-            "works_everywhere": "vous voulez une application qui <strong>fonctionne partout</strong> (ordinateur, smartphone, tablette et smartTV)",
-            "no_cloud": "vous ne <strong>voulez pas stocker vos mots de passe</strong>",
-            "only_one_password": "vous voulez <strong>retenir un seul</strong> mot de passe"
-        },
-        "passwordgenerator": {
-            "email": "Email",
-            "password": "Mot de passe",
-            "unique_password": "Mot de passe unique",
-            "site": "Site",
-            "site_placeholder": "Site (ex: Facebook)",
-            "copy": "Copier",
-            "advanced_options": "Options avancées",
-            "lowercase_options": "minuscules (a-z)",
-            "uppercase_options": "MAJUSCULES (A-Z)",
-            "numbers_options": "nombres (0-9)",
-            "symbols_options": "caractères spéciaux (@&%?)",
-            "counter": "Compteur",
-            "generated_password": "Mot de passe généré",
-            "length": "Longueur"
-        },
-        "faq": {
-            "q_works_in_future": "Est ce que LessPass fonctionnera encore demain ?",
-            "a_works_in_future": "Vous nous posez souvent la question de la pérennité de LessPass. Rassurez-vous, LessPass ne coûte pas grand chose. L'hébergement, le nom de domaine et le certificat HTTPS sont déjà provisionnés jusqu'en février 2017.",
-            "q_trust": "Je ne fais pas confiance à LastPass ou 1password, pourquoi je ferais confiance à LessPass ?",
-            "a_trust_lesspass": "Contrairement aux autres services, LessPass est open source donc le code source peut être réutilisé, consulté et audité. Vous pouvez sauvegarder LessPass sur votre ordinateur ou votre serveur d’enterprise gratuitement. Ah et LessPass n'est connecté à aucun service externe (Google Analytics, Facebook, Twitter, etc..). Personne ne sait à part nous que vous utilisez LessPass.",
-            "a_trust_we": "<strong>Nous ne vous demandons pas de nous faire confiance</strong>. D'où notre approche",
-            "a_trust_oss": "À la différence d'autres services, LessPass est <strong>open-source</strong>. De ce fait il peut être –réellement– audité",
-            "a_trust_code": "Le code source est <a href='https://github.com/oslab-fr/lesspass'>disponible sur Github</a>, vous pouvez donc l'<strong>installer sur votre poste</strong> ou un serveur d'entreprise",
-            "a_trust_tracking": "Nous nous opposons au fichage systématique, et par conséquent <strong>aucun outils d'analyse</strong> n'est utilisé dans l'appli ou le site (ex: pas de <i>Google Analytics</i>, <i>Facebook</i>, etc.)",
-            "a_trust_client_side": "La génération des mots de passe doit rester sous votre controle, elle se fait sur votre <strong>navigateur</strong>",
-            "a_trust_online": "<em>le mode connecté</em> a pour but de suggérer vos <var>email</var>s et <var>site</var>s, <i>c.-à-d.</i> qu'il ne stocke rien d'autre",
-            "source_code": "Auditez le code source",
-            "q_make_it_safer": "Comment puis-je rendre LessPass encore plus sûr ?",
-            "a_make_it_safer_private": "Utilisez la <strong><a href='https://fr.wikipedia.org/wiki/Navigation_priv%C3%A9e'>navigation privé</a></strong> de votre navigateur</strong> et fermez le quand vous avez terminé.",
-            "a_make_it_safer_update": "Garder votre navigateur à jour (ce qui corrige les bugs de sécurité).",
-            "q_roadmap": "Quelles fonctionnalités sont prévues pour les versions à venir ?",
-            "a_roadmap_preset_saving": "application connecté pour sauvegarder les informations sur les sites",
-            "a_roadmap_15min_memory": "suppression du mot de passe après 15 minutes d’inactivités",
-            "a_roadmap_offline_mode": "enregistrement des sites en mode déconnecté",
-            "q_password_generation": "Où sont générés les mots de passe ?",
-            "a_password_generation": "La génération du mot de passe est effectué sur votre navigateur et pas sur les serveurs de LessPass.",
-            "q_pricing": "Est ce que LessPass est gratuit ?",
-            "a_pricing_free": "LessPass est gratuit et le sera toujours.",
-            "a_pricing_enterprise": "LessPass Enterprise, avec le support <abbr title='Lightweight Directory Access Protocol'>LDAP</abbr> et la double authentication, sera payante pour les enterprises."
-        },
-        "login": {
-            "login": "Connectez-vous",
-            "register": "S'enregistrer",
-            "why": "Gérez vos mots de passe avec le mode connecté",
-            "enter_email": "Entrez votre email",
-            "enter_password": "Entrez votre mot de passe",
-            "lets_go": "C'est parti !",
-            "dont_have_an_account": "Vous n'avez pas encore de compte ?",
-            "already_have_an_account": "Vous avez déjà un compte ?",
-            "create_account": "Créez un compte",
-            "welcome": "Connexion réussie, bienvenue sur LessPass",
-            "credentials_invalids": "L' adresse e-mail et/ou mot de passe sont invalides"
-        },
-        "register": {
-            "beta" : "LessPass Application est pour l'instant en version beta. Vous pouvez utilisez LessPass <a href='#password-generator'><b>en mode deconnecté</b></a>"
-        }
-    }
-};
-
-
-export default locales;
diff --git a/app/main.js b/app/main.js
index af95999..58bf81f 100644
--- a/app/main.js
+++ b/app/main.js
@@ -1,51 +1,13 @@
-import Vue from 'vue'
-import Router from 'vue-router';
-import Resource from 'vue-resource';
-import i18n from 'vue-i18n';
+require('../node_modules/bootstrap/dist/css/bootstrap.css');
+require('../node_modules/font-awesome/css/font-awesome.min.css');
+require('../node_modules/bootstrap/dist/js/umd/collapse.js');
 
-import locales from './locales/locales';
-import App from './app.vue';
-import IndexView from './components/index.vue';
-import Dashboard from './components/dashboard.vue';
-import auth from './services/auth';
-Vue.use(Resource);
-Vue.use(Router);
+var Vue = require('vue');
 
+Vue.config.debug = true;
 
-var browserLanguage = (navigator.language || navigator.browserLanguage).split('-')[0];
-var lang = browserLanguage in locales ? browserLanguage : 'en';
-Vue.use(i18n, {
-    lang: lang,
-    locales: locales
-});
+require('./locales.js');
+require('./router.js');
 
-
-Vue.http.headers.common['Authorization'] = 'Bearer ' + localStorage.getItem('token');
-
-auth.checkAuth();
-
-export var router = new Router();
-
-router.map({
-    '/': {
-        auth: true,
-        component: Dashboard
-    },
-    '/presentation/': {
-        component: IndexView
-    }
-});
-
-router.redirect({
-    '*': '/'
-});
-
-router.start(App, '#app');
-
-router.beforeEach(function (transition) {
-    if (transition.to.auth && !auth.user.authenticated) {
-        transition.redirect('/presentation/')
-    } else {
-        transition.next()
-    }
-});
\ No newline at end of file
+var Resource = require('vue-resource');
+Vue.use(Resource);
\ No newline at end of file
diff --git a/app/main.old.js b/app/main.old.js
new file mode 100644
index 0000000..af95999
--- /dev/null
+++ b/app/main.old.js
@@ -0,0 +1,51 @@
+import Vue from 'vue'
+import Router from 'vue-router';
+import Resource from 'vue-resource';
+import i18n from 'vue-i18n';
+
+import locales from './locales/locales';
+import App from './app.vue';
+import IndexView from './components/index.vue';
+import Dashboard from './components/dashboard.vue';
+import auth from './services/auth';
+Vue.use(Resource);
+Vue.use(Router);
+
+
+var browserLanguage = (navigator.language || navigator.browserLanguage).split('-')[0];
+var lang = browserLanguage in locales ? browserLanguage : 'en';
+Vue.use(i18n, {
+    lang: lang,
+    locales: locales
+});
+
+
+Vue.http.headers.common['Authorization'] = 'Bearer ' + localStorage.getItem('token');
+
+auth.checkAuth();
+
+export var router = new Router();
+
+router.map({
+    '/': {
+        auth: true,
+        component: Dashboard
+    },
+    '/presentation/': {
+        component: IndexView
+    }
+});
+
+router.redirect({
+    '*': '/'
+});
+
+router.start(App, '#app');
+
+router.beforeEach(function (transition) {
+    if (transition.to.auth && !auth.user.authenticated) {
+        transition.redirect('/presentation/')
+    } else {
+        transition.next()
+    }
+});
\ No newline at end of file
diff --git a/app/router.js b/app/router.js
new file mode 100644
index 0000000..e552922
--- /dev/null
+++ b/app/router.js
@@ -0,0 +1,43 @@
+var Vue = require('vue');
+var Router = require('vue-router');
+
+var App = require('./app.vue');
+var IndexView = require('./components/index.vue');
+var Dashboard = require('./components/dashboard.vue');
+
+Vue.use(Router);
+
+var router = new Router();
+
+router.map({
+    '/': {
+        auth: true,
+        component: Dashboard
+    },
+    '/presentation/': {
+        component: IndexView
+    }
+});
+
+router.redirect({
+    '*': '/'
+});
+
+router.start(App, '#app');
+
+var Auth = require('./services/auth.js');
+
+Auth.checkAuth();
+
+router.beforeEach(function (transition) {
+    if (transition.to.auth && !Auth.user.authenticated) {
+        transition.redirect('/presentation/')
+    } else {
+        transition.next()
+    }
+});
+
+module.exports = router;
+
+
+
diff --git a/app/services/auth.js b/app/services/auth.js
index 02b58fa..d1d6131 100644
--- a/app/services/auth.js
+++ b/app/services/auth.js
@@ -1,7 +1,6 @@
-import {router} from '../main'
-import logging from './logging'
+var logging = require('./logging.js');
 
-export default {
+module.exports = {
     user: {
         authenticated: false
     },
@@ -53,4 +52,4 @@ export default {
             'Authorization': 'Bearer ' + localStorage.getItem('token')
         }
     }
-}
+};
diff --git a/app/services/logging.js b/app/services/logging.js
index 9b5969a..6675119 100644
--- a/app/services/logging.js
+++ b/app/services/logging.js
@@ -1,4 +1,5 @@
-import toastr from 'toastr'
+var toastr = require('toastr');
+require('toastr/build/toastr.min.css');
 
 toastr.options = {
     "closeButton": true,
@@ -10,7 +11,7 @@ toastr.options = {
     "onclick": null,
     "showDuration": "300",
     "hideDuration": "1000",
-    "timeOut": "5000",
+    "timeOut": "10000",
     "extendedTimeOut": "1000",
     "showEasing": "swing",
     "hideEasing": "linear",
@@ -18,7 +19,7 @@ toastr.options = {
     "hideMethod": "fadeOut"
 };
 
-export default {
+module.exports = {
     error(message){
         toastr.error(message);
     },
@@ -31,4 +32,4 @@ export default {
     clear(){
         toastr.clear();
     }
-}
+};
diff --git a/index.html b/index.html
index 683d33a..6d0c879 100644
--- a/index.html
+++ b/index.html
@@ -26,6 +26,6 @@
 </head>
 <body>
 <div id="app"></div>
-<script src="dist/app.js"></script>
+<script src="dist/bundle.js"></script>
 </body>
 </html>
diff --git a/package.json b/package.json
index e254fbc..52e3306 100644
--- a/package.json
+++ b/package.json
@@ -9,7 +9,7 @@
     "predev": "npm install",
     "dev": "webpack-dev-server --inline --hot --host 0.0.0.0",
     "prebuild": "rimraf dist && npm prune && npm install",
-    "build": "NODE_ENV=production webpack --progress --hide-modules",
+    "build": "NODE_ENV=production webpack -p",
     "start": "NODE_ENV=production node server.js"
   },
   "repository": {
@@ -28,22 +28,22 @@
   "homepage": "https://github.com/guillaumevincent/lesspass#readme",
   "dependencies": {
     "bootstrap": "^4.0.0-alpha.2",
-    "clipboard": "^1.5.5",
+    "clipboard": "^1.5.8",
     "express": "^4.13.4",
     "font-awesome": "^4.5.0",
     "jquery": "^2.2.0",
     "tether": "^1.1.1",
     "toastr": "^2.1.2",
-    "vue": "^1.0.15",
-    "vue-i18n": "^2.3.3",
+    "vue": "^1.0.16",
+    "vue-i18n": "^2.4.0",
     "vue-resource": "^0.7.0",
     "vue-router": "^0.7.10"
   },
   "devDependencies": {
-    "babel-core": "^6.4.5",
-    "babel-loader": "^6.2.1",
-    "babel-plugin-transform-runtime": "^6.4.3",
-    "babel-preset-es2015": "^6.3.13",
+    "babel-core": "^6.5.1",
+    "babel-loader": "^6.2.2",
+    "babel-plugin-transform-runtime": "^6.5.0",
+    "babel-preset-es2015": "^6.5.0",
     "babel-runtime": "^5.8.34",
     "css-loader": "^0.23.1",
     "eslint": "^1.10.3",
@@ -57,16 +57,17 @@
     "nodemon": "latest",
     "npm-run-all": "latest",
     "rimraf": "^2.5.1",
+    "style-loader": "^0.13.0",
     "template-html-loader": "0.0.3",
     "uglify-js": "^2.6.1",
     "url-loader": "^0.5.7",
-    "vue-hot-reload-api": "^1.2.2",
+    "vue-hot-reload-api": "^1.3.2",
     "vue-html-loader": "^1.1.0",
-    "vue-loader": "^8.0.2",
+    "vue-loader": "^8.1.1",
     "vue-style-loader": "^1.0.0",
-    "vueify": "^8.3.2",
+    "vueify": "^8.3.5",
     "vueify-insert-css": "^1.0.0",
-    "webpack": "^1.12.12",
+    "webpack": "^1.12.13",
     "webpack-dev-server": "^1.14.1"
   },
   "babel": {
diff --git a/webpack.config.js b/webpack.config.js
index 8e94385..89467d8 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,61 +1,38 @@
 var webpack = require('webpack');
 
 module.exports = {
-    entry: ['./app/main.js'],
+    context: __dirname + "/app",
+    entry: "./main.js",
     output: {
-        path: './dist',
+        path: __dirname + "/dist",
         publicPath: '/dist/',
-        filename: 'app.js'
-    },
-    devServer: {
-        port: 8080
+        filename: "bundle.js"
     },
+
     module: {
         loaders: [
-            {
-                test: /\.scss$/,
-                loaders: ['css', 'sass']
-            },
+            //{test: /\.js$/, loader: 'babel-loader', query: {presets: ['es2015']}},
+
             {
                 test: /\.js$/,
                 exclude: /node_modules|vue\/dist|vue-router\/|vue-loader\/|vue-hot-reload-api\//,
                 loader: 'babel'
             },
-            {
-                test: /\.vue$/,
-                loader: 'vue'
-            },
-            {
-                test: /\.(png|jpe?g|gif)$/,
-                loader: 'url',
-                query: {
-                    limit: 10000,
-                    name: '[name].[ext]?[hash]'
-                }
-            }
+            {test: /\.css$/, loader: 'style-loader!css-loader'},
+            {test: /\.(png|jpg)$/, loader: 'url-loader?limit=8192'},
+            {test: /\.vue$/, loader: 'vue'},
+            { test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=application/font-woff"},
+            { test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=application/font-woff"},
+            { test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=application/octet-stream"},
+            {test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: "file"},
+            { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: "url?limit=10000&mimetype=image/svg+xml"}
         ]
     },
-    babel: {
-        presets: ['es2015'],
-        plugins: ['transform-runtime']
-    }
-};
-
-if (process.env.NODE_ENV === 'production') {
-    module.exports.plugins = [
-        new webpack.DefinePlugin({
-            'process.env': {
-                NODE_ENV: '"production"'
-            }
-        }),
-        new webpack.optimize.UglifyJsPlugin({
-            compress: {
-                warnings: false
-            },
-            comments: false
-        }),
-        new webpack.optimize.OccurenceOrderPlugin()
+    plugins: [
+        new webpack.ProvidePlugin({
+            $: "jquery",
+            jQuery: "jquery",
+            "window.jQuery": "jquery"
+        })
     ]
-} else {
-    module.exports.devtool = '#source-map'
-}
\ No newline at end of file
+};
\ No newline at end of file
diff --git a/webpack.config.old.js b/webpack.config.old.js
new file mode 100644
index 0000000..553bf9e
--- /dev/null
+++ b/webpack.config.old.js
@@ -0,0 +1,86 @@
+var webpack = require('webpack');
+
+module.exports = {
+    entry: ['./app/main.js'],
+    output: {
+        path: './dist',
+        publicPath: '/dist/',
+        filename: 'app.js'
+    },
+    devServer: {
+        port: 8080
+    },
+    module: {
+        loaders: [
+            {
+                test: /\.scss$/,
+                loaders: ['css', 'sass']
+            },
+            {
+                test: /\.js$/,
+                exclude: /node_modules|vue\/dist|vue-router\/|vue-loader\/|vue-hot-reload-api\//,
+                loader: 'babel'
+            },
+            {
+                test: /\.vue$/,
+                loader: 'vue'
+            },
+            {
+                test: /\.(png|jpe?g|gif)$/,
+                loader: 'url',
+                query: {
+                    limit: 10000,
+                    name: '[name].[ext]?[hash]'
+                }
+            },
+            {
+                test: /\.woff(\?v=\d+\.\d+\.\d+)?$/,
+                loader: "url?limit=10000&mimetype=application/font-woff"
+            },
+            {
+                test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/,
+                loader: "url?limit=10000&mimetype=application/font-woff"
+            },
+            {
+                test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
+                loader: "url?limit=10000&mimetype=application/octet-stream"
+            },
+            {
+                test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
+                loader: "file"
+            },
+            {
+                test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
+                loader: "url?limit=10000&mimetype=image/svg+xml"
+            }
+        ]
+    },
+    babel: {
+        presets: ['es2015'],
+        plugins: ['transform-runtime']
+    },
+    plugins: [
+        new webpack.ProvidePlugin({
+            $: "jquery",
+            jQuery: "jquery",
+            "window.jQuery": "jquery"
+        })
+    ]
+};
+
+if (process.env.NODE_ENV === 'production') {
+    module.exports.plugins = [
+        new webpack.DefinePlugin({
+            'process.env': {
+                NODE_ENV: '"production"'
+            }
+        }),
+        new webpack.optimize.UglifyJsPlugin({
+            compress: {
+                warnings: false
+            },
+            comments: false
+        }),
+        new webpack.optimize.OccurenceOrderPlugin()
+    ]
+}
\ No newline at end of file