diff --git a/meta.js b/meta.js
index 3cd3291..3c1bb54 100644
--- a/meta.js
+++ b/meta.js
@@ -51,15 +51,15 @@ module.exports = {
       "message": "Port that mock server listen at",
       "default": 7878
     },
-    "i18n": {
+    "i18nEn": {
       "type": "confirm",
       "message": "Need vue-i18n?"
     }
   },
   "filters": {
-    "tasks/replaceI18n.js": "!i18n",
+    "tasks/replaceI18n.js": "!i18nEn",
     "tasks/mock.js": "mock==='mock'",
-    "tasks/remove.js": "!i18n||mock==='mock'",
+    "tasks/remove.js": "!i18nEn||mock==='mock'",
     "mock/**/*": "mock==='mock'"
   },
   "skipInterpolation": "{client/**/*.vue,tasks/**/*.*}",
diff --git a/template/.babelrc b/template/.babelrc
index 6b48907..d733533 100644
--- a/template/.babelrc
+++ b/template/.babelrc
@@ -6,7 +6,7 @@
   "plugins": ["transform-runtime", ["component", [
     {
       "libraryName": "element-ui",
-      "styleLibraryName": "theme-default"
+      "styleLibraryName": "theme-chalk"
     }
   ]]],
   "comments": false
diff --git a/template/.eslintrc.js b/template/.eslintrc.js
index 64691dd..17a35db 100644
--- a/template/.eslintrc.js
+++ b/template/.eslintrc.js
@@ -1,7 +1,9 @@
 module.exports = {
   root: true,
-  // https://github.com/vuejs/eslint-config-vue
-  extends: 'vue',
+  extends: [
+    // 'eslint:recommended',
+    'plugin:vue/recommended'
+  ],
   // required to lint *.vue files
   plugins: [
     'html'
@@ -15,8 +17,8 @@ module.exports = {
     "it": true,
     "describe": true
   },
-  parser: 'babel-eslint',
   parserOptions: {
+    parser: 'babel-eslint',
     sourceType: 'module',
     allowImportExportEverywhere: false
   }
diff --git a/template/client/src/components/Header.vue b/template/client/src/components/Header.vue
index 5d77a40..ff7fec1 100644
--- a/template/client/src/components/Header.vue
+++ b/template/client/src/components/Header.vue
@@ -16,7 +16,7 @@
         </el-dropdown>
       </div>
       <!-- user settings -->
-      <el-dialog :title="$t('header.settings')" v-model="config.visible" size="small"
+      <el-dialog :title="$t('header.settings')" :visible.sync="config.visible" size="small"
         top="4%" @close="cancelConfig">
         <el-form class="noline" ref="config" label-position="top"
           :model="config.form" :rules="config.rules">
@@ -36,7 +36,7 @@
         </span>
       </el-dialog>
       <!-- change password -->
-      <el-dialog :title="$t('header.password')" v-model="password.visible" size="small" @close="cancelPassword">
+      <el-dialog :title="$t('header.password')" :visible.sync="password.visible" size="small" @close="cancelPassword">
         <el-form label-position="top" :model="password.form"
           :rules="password.rules" ref="password">
           <el-row :gutter="20">
@@ -70,9 +70,9 @@
 import { mapGetters, mapActions } from 'vuex'
 import { merge } from 'lodash'
 import { user as userResource } from 'resources'
-import locales from 'locales/header'
+import i18n from 'locales/header'
 export default {
-  locales,
+  i18n,
   data () {
     return {
       config: {
diff --git a/template/client/src/components/NavMenu.vue b/template/client/src/components/NavMenu.vue
index f3f3212..432fb21 100644
--- a/template/client/src/components/NavMenu.vue
+++ b/template/client/src/components/NavMenu.vue
@@ -11,10 +11,10 @@
 </template>
 <script>
 import { mapGetters } from 'vuex'
-import locales from 'locales/menu'
+import i18n from 'locales/menu'
 import { Menu, Submenu, MenuItem, MenuItemGroup } from 'element-ui'
 export default {
-  locales,
+  i18n,
   computed: {
     ...mapGetters(['loggedIn'])
   },
diff --git a/template/client/src/components/Pagination.vue b/template/client/src/components/Pagination.vue
index 12bb057..7c68dc1 100644
--- a/template/client/src/components/Pagination.vue
+++ b/template/client/src/components/Pagination.vue
@@ -20,9 +20,9 @@
 </template>
 <script>
 import { mapGetters } from 'vuex'
-import locales from 'locales/pagination'
+import i18n from 'locales/pagination'
 export default {
-  locales,
+  i18n,
   props: {
     current: {
       type: Number,
diff --git a/template/client/src/constants.js b/template/client/src/constants.js
index c101c93..027118d 100644
--- a/template/client/src/constants.js
+++ b/template/client/src/constants.js
@@ -4,5 +4,5 @@ export const STORE_KEY_ACCESS_TOKEN = 'user.access_token'
 export const STORE_KEY_REFRESH_TOKEN = 'user.refresh_token'
 
 // user config
-{{#if i18n}}export const STORE_KEY_CONFIG_LANG = 'config.lang'
+{{#if i18nEn}}export const STORE_KEY_CONFIG_LANG = 'config.lang'
 {{/if}}export const STORE_KEY_CONFIG_PAGE_LIMIT = 'config.page.limit'
diff --git a/template/client/src/element-ui.js b/template/client/src/element-ui.js
index faba122..aa2da6d 100644
--- a/template/client/src/element-ui.js
+++ b/template/client/src/element-ui.js
@@ -1,67 +1,150 @@
 import Vue from 'vue'
-import { Dialog, Autocomplete, Dropdown, DropdownMenu, DropdownItem, Input, InputNumber,
-  Radio, RadioGroup, RadioButton, Checkbox, CheckboxGroup, Switch, Select, Option,
-  OptionGroup, Button, ButtonGroup, Table, TableColumn, DatePicker, TimeSelect, TimePicker,
-  Popover, Tooltip, MessageBox, Breadcrumb, BreadcrumbItem, Form, FormItem, Tabs, TabPane,
-  Tag, Tree, Notification, Slider, Loading, Row, Col, Upload, Progress, Spinner,
-  Message, Badge, Card, Steps, Step } from 'element-ui'
+import {
+  Pagination,
+  Dialog,
+  Autocomplete,
+  Dropdown,
+  DropdownMenu,
+  DropdownItem,
+  Menu,
+  Submenu,
+  MenuItem,
+  MenuItemGroup,
+  Input,
+  InputNumber,
+  Radio,
+  RadioGroup,
+  RadioButton,
+  Checkbox,
+  CheckboxButton,
+  CheckboxGroup,
+  Switch,
+  Select,
+  Option,
+  OptionGroup,
+  Button,
+  ButtonGroup,
+  Table,
+  TableColumn,
+  DatePicker,
+  TimeSelect,
+  TimePicker,
+  Popover,
+  Tooltip,
+  Breadcrumb,
+  BreadcrumbItem,
+  Form,
+  FormItem,
+  Tabs,
+  TabPane,
+  Tag,
+  Tree,
+  Alert,
+  Slider,
+  Icon,
+  Row,
+  Col,
+  Upload,
+  Progress,
+  Badge,
+  Card,
+  Rate,
+  Steps,
+  Step,
+  Carousel,
+  CarouselItem,
+  Collapse,
+  CollapseItem,
+  Cascader,
+  ColorPicker,
+  Transfer,
+  Container,
+  Header,
+  Aside,
+  Main,
+  Footer,
+  Loading,
+  MessageBox,
+  Message,
+  Notification,
+} from 'element-ui';
 
-Vue.component(Dialog.name, Dialog)
-Vue.component(Autocomplete.name, Autocomplete)
-Vue.component(Dropdown.name, Dropdown)
-Vue.component(DropdownMenu.name, DropdownMenu)
-Vue.component(DropdownItem.name, DropdownItem)
-Vue.component(Input.name, Input)
-Vue.component(InputNumber.name, InputNumber)
-Vue.component(Radio.name, Radio)
-Vue.component(RadioGroup.name, RadioGroup)
-Vue.component(RadioButton.name, RadioButton)
-Vue.component(Checkbox.name, Checkbox)
-Vue.component(CheckboxGroup.name, CheckboxGroup)
-Vue.component(Switch.name, Switch)
-Vue.component(Select.name, Select)
-Vue.component(Option.name, Option)
-Vue.component(OptionGroup.name, OptionGroup)
-Vue.component(Button.name, Button)
-Vue.component(ButtonGroup.name, ButtonGroup)
-Vue.component(Table.name, Table)
-Vue.component(TableColumn.name, TableColumn)
-Vue.component(DatePicker.name, DatePicker)
-Vue.component(TimeSelect.name, TimeSelect)
-Vue.component(TimePicker.name, TimePicker)
-Vue.component(Popover.name, Popover)
-Vue.component(Tooltip.name, Tooltip)
-Vue.component(Breadcrumb.name, Breadcrumb)
-Vue.component(BreadcrumbItem.name, BreadcrumbItem)
-Vue.component(Form.name, Form)
-Vue.component(FormItem.name, FormItem)
-Vue.component(Tabs.name, Tabs)
-Vue.component(TabPane.name, TabPane)
-Vue.component(Tag.name, Tag)
-Vue.component(Tree.name, Tree)
-Vue.component(Slider.name, Slider)
-Vue.component(Row.name, Row)
-Vue.component(Col.name, Col)
-Vue.component(Upload.name, Upload)
-Vue.component(Progress.name, Progress)
-Vue.component(Spinner.name, Spinner)
-Vue.component(Badge.name, Badge)
-Vue.component(Card.name, Card)
-Vue.component(Steps.name, Steps)
-Vue.component(Step.name, Step)
+import 'element-ui/lib/theme-chalk/index.css'
+
+Vue.use(Pagination);
+Vue.use(Dialog);
+Vue.use(Autocomplete);
+Vue.use(Dropdown);
+Vue.use(DropdownMenu);
+Vue.use(DropdownItem);
+Vue.use(Menu);
+Vue.use(Submenu);
+Vue.use(MenuItem);
+Vue.use(MenuItemGroup);
+Vue.use(Input);
+Vue.use(InputNumber);
+Vue.use(Radio);
+Vue.use(RadioGroup);
+Vue.use(RadioButton);
+Vue.use(Checkbox);
+Vue.use(CheckboxButton);
+Vue.use(CheckboxGroup);
+Vue.use(Switch);
+Vue.use(Select);
+Vue.use(Option);
+Vue.use(OptionGroup);
+Vue.use(Button);
+Vue.use(ButtonGroup);
+Vue.use(Table);
+Vue.use(TableColumn);
+Vue.use(DatePicker);
+Vue.use(TimeSelect);
+Vue.use(TimePicker);
+Vue.use(Popover);
+Vue.use(Tooltip);
+Vue.use(Breadcrumb);
+Vue.use(BreadcrumbItem);
+Vue.use(Form);
+Vue.use(FormItem);
+Vue.use(Tabs);
+Vue.use(TabPane);
+Vue.use(Tag);
+Vue.use(Tree);
+Vue.use(Alert);
+Vue.use(Slider);
+Vue.use(Icon);
+Vue.use(Row);
+Vue.use(Col);
+Vue.use(Upload);
+Vue.use(Progress);
+Vue.use(Badge);
+Vue.use(Card);
+Vue.use(Rate);
+Vue.use(Steps);
+Vue.use(Step);
+Vue.use(Carousel);
+Vue.use(CarouselItem);
+Vue.use(Collapse);
+Vue.use(CollapseItem);
+Vue.use(Cascader);
+Vue.use(ColorPicker);
+Vue.use(Transfer);
+Vue.use(Container);
+Vue.use(Header);
+Vue.use(Aside);
+Vue.use(Main);
+Vue.use(Footer);
+
+Vue.use(Loading.directive);
 
-Vue.use(Loading.directive)
 try {
-  var a = MessageBox
-  var b = Message
-  var c = Notification
-  Vue.prototype.$loading = Loading.service
-  Vue.prototype.$msgbox = a
-  Vue.prototype.$alert = a.alert
-  Vue.prototype.$confirm = a.confirm
-  Vue.prototype.$prompt = a.prompt
-  Vue.prototype.$notify = c
-  Vue.prototype.$message = b
+  Vue.prototype.$loading = Loading.service;
+  Vue.prototype.$msgbox = MessageBox;
+  Vue.prototype.$alert = MessageBox.alert;
+  Vue.prototype.$confirm = MessageBox.confirm;
+  Vue.prototype.$prompt = MessageBox.prompt;
+  Vue.prototype.$notify = Notification;
+  Vue.prototype.$message = Message;
 } catch (e) {
   console.log(e)
 } finally {
diff --git a/template/client/src/locales/header/index.js b/template/client/src/locales/header/index.js
index 17e8c63..5f4a832 100644
--- a/template/client/src/locales/header/index.js
+++ b/template/client/src/locales/header/index.js
@@ -2,6 +2,8 @@ import en from './en'
 import zhCN from './zh-CN'
 
 export default {
-  'zh-CN': zhCN,
-  en
+  messages: {
+    'zh-CN': zhCN,
+    en
+  }
 }
diff --git a/template/client/src/locales/index.js b/template/client/src/locales/index.js
index 6c08dee..656fb06 100644
--- a/template/client/src/locales/index.js
+++ b/template/client/src/locales/index.js
@@ -8,6 +8,8 @@ import en from './en'
 import eleZhCN from 'element-ui/lib/locale/lang/zh-CN'
 import eleEn from 'element-ui/lib/locale/lang/en'
 
+import ElementLocale from 'element-ui/lib/locale'
+
 const locales = {
   'zh-CN': merge(zhCN, eleZhCN),
   en: merge(en, eleEn)
@@ -15,10 +17,13 @@ const locales = {
 
 Vue.use(VueI18n)
 
-Vue.config.lang = lang
-Vue.config.fallbackLang = 'zh-CN'
-
-// set locales
-Object.keys(locales).forEach(lang => {
-  Vue.locale(lang, locales[lang])
+const i18n = new VueI18n({
+  locale: lang,
+  fallbackLocale: 'zh-CN',
+  silentTranslationWarn: true,
+  messages: locales
 })
+
+ElementLocale.i18n((key, value) => i18n.t(key, value))
+
+export default i18n
diff --git a/template/client/src/locales/login/index.js b/template/client/src/locales/login/index.js
index 17e8c63..5f4a832 100644
--- a/template/client/src/locales/login/index.js
+++ b/template/client/src/locales/login/index.js
@@ -2,6 +2,8 @@ import en from './en'
 import zhCN from './zh-CN'
 
 export default {
-  'zh-CN': zhCN,
-  en
+  messages: {
+    'zh-CN': zhCN,
+    en
+  }
 }
diff --git a/template/client/src/locales/menu/index.js b/template/client/src/locales/menu/index.js
index 17e8c63..5f4a832 100644
--- a/template/client/src/locales/menu/index.js
+++ b/template/client/src/locales/menu/index.js
@@ -2,6 +2,8 @@ import en from './en'
 import zhCN from './zh-CN'
 
 export default {
-  'zh-CN': zhCN,
-  en
+  messages: {
+    'zh-CN': zhCN,
+    en
+  }
 }
diff --git a/template/client/src/locales/pagination/index.js b/template/client/src/locales/pagination/index.js
index 17e8c63..5f4a832 100644
--- a/template/client/src/locales/pagination/index.js
+++ b/template/client/src/locales/pagination/index.js
@@ -2,6 +2,8 @@ import en from './en'
 import zhCN from './zh-CN'
 
 export default {
-  'zh-CN': zhCN,
-  en
+  messages: {
+    'zh-CN': zhCN,
+    en
+  }
 }
diff --git a/template/client/src/locales/things/index.js b/template/client/src/locales/things/index.js
index 17e8c63..5f4a832 100644
--- a/template/client/src/locales/things/index.js
+++ b/template/client/src/locales/things/index.js
@@ -2,6 +2,8 @@ import en from './en'
 import zhCN from './zh-CN'
 
 export default {
-  'zh-CN': zhCN,
-  en
+  messages: {
+    'zh-CN': zhCN,
+    en
+  }
 }
diff --git a/template/client/src/locales/users/en.js b/template/client/src/locales/users/en.js
index 446f985..f625d28 100644
--- a/template/client/src/locales/users/en.js
+++ b/template/client/src/locales/users/en.js
@@ -18,6 +18,9 @@ export default {
     },
     action: {
       userExisted: 'User existed'
+    },
+    confirm: {
+      remove: 'This action will remove the selected user: {0} forever, still going on?'
     }
   }
 }
diff --git a/template/client/src/locales/users/index.js b/template/client/src/locales/users/index.js
index 17e8c63..5f4a832 100644
--- a/template/client/src/locales/users/index.js
+++ b/template/client/src/locales/users/index.js
@@ -2,6 +2,8 @@ import en from './en'
 import zhCN from './zh-CN'
 
 export default {
-  'zh-CN': zhCN,
-  en
+  messages: {
+    'zh-CN': zhCN,
+    en
+  }
 }
diff --git a/template/client/src/locales/users/zh-CN.js b/template/client/src/locales/users/zh-CN.js
index 7908d09..39fe2e9 100644
--- a/template/client/src/locales/users/zh-CN.js
+++ b/template/client/src/locales/users/zh-CN.js
@@ -1,4 +1,4 @@
-export default {
+export default {
   user: {
     breadcrumb: {
       home: '首页',
@@ -18,6 +18,9 @@ export default {
     },
     action: {
       userExisted: '用户已存在'
+    },
+    confirm: {
+      remove: 'This action will remove the selected user: {0} forever, still going on?'
     }
   }
 }
diff --git a/template/client/src/main.js b/template/client/src/main.js
index 0051e74..a4c7a43 100644
--- a/template/client/src/main.js
+++ b/template/client/src/main.js
@@ -1,9 +1,9 @@
 import Vue from 'vue'
 // read localStorage stored data
 import './stored'
-{{#if i18n}}
+{{#if i18nEn}}
 // locale
-import './locales'
+import i18n from './locales'
 {{/if}}
 
 // router and store
@@ -28,6 +28,9 @@ import './socket'
 
 userPromise.then(() => {
   const app = new Vue({
+{{#if i18nEn}}
+    i18n,
+{{/if}}
     router,
     store,
     ...App // Object spread copying everything from App.vue
diff --git a/template/client/src/store/modules/global-config.js b/template/client/src/store/modules/global-config.js
index bbdb2e6..3b22f59 100644
--- a/template/client/src/store/modules/global-config.js
+++ b/template/client/src/store/modules/global-config.js
@@ -1,10 +1,10 @@
-{{#if i18n}}import Vue from 'vue'{{/if}}
-import { {{#if i18n}}lang, {{/if}}pageLimit } from '../../stored'
+{{#if i18nEn}}import i18n from '../../locales'{{/if}}
+import { {{#if i18nEn}}lang, {{/if}}pageLimit } from '../../stored'
 import { save } from '../../storage'
-import { {{#if i18n}}STORE_KEY_CONFIG_LANG, {{/if}}STORE_KEY_CONFIG_PAGE_LIMIT } from '../../constants'
+import { {{#if i18nEn}}STORE_KEY_CONFIG_LANG, {{/if}}STORE_KEY_CONFIG_PAGE_LIMIT } from '../../constants'
 
 const state = {
-  {{#if i18n}}lang: lang,
+  {{#if i18nEn}}lang: lang,
   // value see http://stackoverflow.com/questions/5580876/navigator-language-list-of-all-languages
   langs: [{
     label: '中文',
@@ -18,27 +18,27 @@ const state = {
 
 const mutations = {
   UPDATE (state, config) {
-    {{#if i18n}}state.lang = config.lang || state.lang
+    {{#if i18nEn}}state.lang = config.lang || state.lang
     {{/if}}state.pageLimit = config.pageLimit || state.pageLimit
-  }{{#if i18n}},
+  }{{#if i18nEn}},
   UPDATE_LANG (state, lang) {
     state.lang = lang || state.lang
   }{{/if}}
 }
 
 const actions = {
-  {{#if i18n}}changeLang ({ commit }, lang) {
-    Vue.config.lang = lang
+  {{#if i18nEn}}changeLang ({ commit }, lang) {
+    i18n.locale = lang
     commit('UPDATE_LANG', lang)
     save(STORE_KEY_CONFIG_LANG, lang)
   },
   {{/if}}updateGlobalConfig ({ commit, state, dispatch }, config) {
-    {{#if i18n}}if (config.lang !== state.lang) {
-      Vue.config.lang = config.lang
+    {{#if i18nEn}}if (config.lang !== state.lang) {
+      i18n.locale = config.lang
       save(STORE_KEY_CONFIG_LANG, config.lang)
     }
     {{/if}}commit('UPDATE', config)
-    {{#if i18n}}save(STORE_KEY_CONFIG_LANG, state.lang)
+    {{#if i18nEn}}save(STORE_KEY_CONFIG_LANG, state.lang)
     {{/if}}save(STORE_KEY_CONFIG_PAGE_LIMIT, state.pageLimit)
   }
 }
diff --git a/template/client/src/view/ThingList.vue b/template/client/src/view/ThingList.vue
index e8b7707..dbeb139 100644
--- a/template/client/src/view/ThingList.vue
+++ b/template/client/src/view/ThingList.vue
@@ -19,7 +19,7 @@
         </p>
       </el-card>
     </div>
-    <el-dialog :title="form._id ? $t('thing.edit.update') : $t('thing.edit.create')" v-model="formVisible">
+    <el-dialog :title="form._id ? $t('thing.edit.update') : $t('thing.edit.create')" :visible.sync="formVisible">
       <el-form :model="form" :rules="rules" ref="thing">
         <el-form-item :label="$t('thing.model.name')" prop="name">
           <el-input v-model="form.name"></el-input>
@@ -37,9 +37,9 @@
 </template>
 <script>
 import { thing as thingRes } from 'resources'
-import locales from 'locales/things'
+import i18n from 'locales/things'
 export default {
-  locales,
+  i18n,
   data () {
     return {
       formVisible: false,
diff --git a/template/client/src/view/UserList.vue b/template/client/src/view/UserList.vue
index 0461994..7f8be6d 100644
--- a/template/client/src/view/UserList.vue
+++ b/template/client/src/view/UserList.vue
@@ -13,13 +13,13 @@
         <el-table-column property="username" :label="$t('user.model.username')" sortable min-width="120"></el-table-column>
         <el-table-column property="role" :label="$t('user.model.role')" min-width="90"></el-table-column>
         <el-table-column :label="$t('operation.operation')" align="center" width="120">
-          <template scope="scope">
+          <template slot-scope="scope">
             <el-button type="text" @click.native="deleteUser(scope.row)">{{$t('operation.remove')}}</el-button>
           </template>
         </el-table-column>
       </el-table>
     </data-table>
-    <el-dialog :title="$t('user.create.title')" v-model="formVisible" @close="cancelForm">
+    <el-dialog :title="$t('user.create.title')" :visible.sync="formVisible" @close="cancelForm">
       <el-form :model="form" :rules="rules" ref="form"
         :close-on-click-modal="false" :close-on-press-escape="false">
         <el-form-item :label="$t('user.model.username')" prop="username">
@@ -39,9 +39,9 @@
 <script>
 import DataTable from 'components/DataTable'
 import { user as userRes } from 'resources'
-import locales from 'locales/users'
+import i18n from 'locales/users'
 export default {
-  locales,
+  i18n,
   data () {
     return {
       search: {
@@ -101,7 +101,7 @@ export default {
       })
     },
     deleteUser (user) {
-      this.$confirm(`This action will remove the selected user: ${user.username} forever, still going on?`, this.$t('confirm.title'), {
+      this.$confirm(this.$t('user.confirm.remove', [user.username]), this.$t('confirm.title'), {
         type: 'warning'
       }).then(() => {
         userRes.delete({ _id: user._id }).then(() => {
diff --git a/template/client/src/view/auth/Login.vue b/template/client/src/view/auth/Login.vue
index 2e38ac5..3749072 100644
--- a/template/client/src/view/auth/Login.vue
+++ b/template/client/src/view/auth/Login.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="login-wrapper" v-show="!loggedIn">
     <div class="bg"></div>
-    <h1>{{$t('title')}}</h1>
+    <h1 v-t="'title'"></h1>
     <el-form ref="form" :model="form" :rules="rules"
       @submit.native.prevent="onSubmit">
       <el-form-item>
@@ -18,7 +18,7 @@
       </el-form-item>
       <el-form-item>
         <el-button class="login-button" :class="{error: loginError}" type="success"
-          native-type="submit" :loading="loading">{{$t('login.button')}}</el-button>
+          native-type="submit" :loading="loading" v-t="'login.button'"></el-button>
       </el-form-item>
     </el-form>
     <!-- <div class="lang">
@@ -31,9 +31,10 @@
 </template>
 <script>
 import { mapGetters, mapActions } from 'vuex'
-import locales from 'locales/login'
+import i18n from 'locales/login'
+
 export default {
-  locales,
+  i18n,
   data () {
     return {
       form: {
diff --git a/template/config.js b/template/config.js
index bf0ef7b..73bd449 100644
--- a/template/config.js
+++ b/template/config.js
@@ -22,9 +22,6 @@ var backendBase = {
   // MongoDB connection options
   mongo: {
     options: {
-      db: {
-        safe: true
-      }
     }
   }
 }{{/if_eq}}
diff --git a/template/nginx.example.conf b/template/nginx.example.conf
index b40b3c6..a268cb5 100644
--- a/template/nginx.example.conf
+++ b/template/nginx.example.conf
@@ -1,53 +1,101 @@
-# enable gzip in nginx.conf
-# gzip on;
 
-# gzip_min_length 1k;
+#user  nobody;
+worker_processes  1;
 
-# gzip_comp_level 4;
+#error_log  logs/error.log;
+#error_log  logs/error.log  notice;
+#error_log  logs/error.log  info;
 
-# gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
+#pid        logs/nginx.pid;
 
-# gzip_vary on;
 
-# gzip_disable "MSIE [1-6]\.";
+events {
+    worker_connections  1024;
+}
 
-server {
-    listen       80;
-    server_name  fullstack.io;
 
-    charset utf-8;
-    root /your/path/to/{{#if_eq mock 'backend'}}client/{{/if_eq}}dist;
+http {
+    include       mime.types;
+    default_type  application/octet-stream;
 
-    access_log logs/{{name}}.access.log main;
-    error_log logs/{{name}}.error.log debug;
+    #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
+    #                  '$status $body_bytes_sent "$http_referer" '
+    #                  '"$http_user_agent" "$http_x_forwarded_for"';
 
-    location /api {
-        proxy_set_header   X-Real-IP $remote_addr;
-        proxy_set_header   Host      $http_host;
-        # change this to your server host
-        proxy_pass         http://127.0.0.1:{{#if_eq mock 'backend'}}{{backendPort}}{{/if_eq}}{{#if_eq mock 'mock'}}port{{/if_eq}};
-    }
+    #access_log  logs/access.log  main;
 
-    location ~* ^.+\.(ico|gif|jpg|jpeg|png)$ {
-        access_log   off;
-        expires      30d;
-    }
+    sendfile        on;
+    #tcp_nopush     on;
 
-    location ~* ^.+\.(css|js|txt|xml|swf|wav)$ {
-        access_log   off;
-        expires      24h;
-    }
+    #keepalive_timeout  0;
+    keepalive_timeout  65;
 
-    location ~* ^.+\.(html|htm)$ {
-        expires      1h;
-    }
+    #gzip  on;
 
-    location ~* ^.+\.(eot|ttf|otf|woff|svg)$ {
-        access_log   off;
-        expires max;
-    }
+    server {
+      listen       80;
+      server_name  fullstack.io;
+
+      charset utf-8;
+
+      access_log  logs/vf-backend.access.log  combined;
+      error_log  logs/vf-backend.error.log  debug;
+
+
+     #set your path to client/dist
+      root dist;
+
+      location /api {
+          proxy_set_header   X-Real-IP $remote_addr;
+          proxy_set_header   Host      $http_host;
+          # change this to your server host
+          proxy_pass         http://127.0.0.1:9000;
+      }
 
-    location / {
-        try_files $uri /index.html;
+      location ~* ^.+\.(ico|gif|jpg|jpeg|png)$ {
+          access_log   off;
+          expires      30d;
+      }
+
+      location ~* ^.+\.(css|js|txt|xml|swf|wav)$ {
+          access_log   off;
+          expires      24h;
+      }
+
+      location ~* ^.+\.(html|htm)$ {
+          expires      1h;
+      }
+
+      location ~* ^.+\.(eot|ttf|otf|woff|svg)$ {
+          access_log   off;
+          expires max;
+      }
+
+      location / {
+          try_files $uri /index.html;
+      }
     }
+
+
+    # HTTPS server
+    #
+    #server {
+    #    listen       443 ssl;
+    #    server_name  localhost;
+
+    #    ssl_certificate      cert.pem;
+    #    ssl_certificate_key  cert.key;
+
+    #    ssl_session_cache    shared:SSL:1m;
+    #    ssl_session_timeout  5m;
+
+    #    ssl_ciphers  HIGH:!aNULL:!MD5;
+    #    ssl_prefer_server_ciphers  on;
+
+    #    location / {
+    #        root   html;
+    #        index  index.html index.htm;
+    #    }
+    #}
+
 }
diff --git a/template/package.json b/template/package.json
index b6713d3..f86edc6 100644
--- a/template/package.json
+++ b/template/package.json
@@ -1,6 +1,6 @@
 {
   "name": "{{name}}",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "keywords": [
     "vue",
     "vuejs",
@@ -24,99 +24,96 @@
     "mock": "./node_modules/.bin/nodemon --watch mock mock/index.js",{{/if_eq}}
     "dev": "npm run client|npm run {{#if_eq mock 'backend'}}server{{/if_eq}}{{#if_eq mock 'mock'}}mock{{/if_eq}}",
     "build": "node {{#if_eq mock 'backend'}}client/{{/if_eq}}build/build.js",
-    {{#unless i18n}}"remove:i18n": "node tasks/replaceI18n.js",
+    {{#unless i18nEn}}"remove:i18nEn": "node tasks/replaceI18n.js",
     {{/unless}}{{#if_eq mock 'mock'}}"remove:mock": "node tasks/mock.js",
     {{/if_eq}}"lint": "eslint --ext .js,.vue {{#if_eq mock 'backend'}}client/{{/if_eq}}src"
   },
   "dependencies": {
     {{#if_eq mock "backend"}}
-    "body-parser": "^1.15.2",
+    "body-parser": "^1.18.2",
     "composable-middleware": "^0.3.0",
-    "compression": "^1.6.2",
+    "compression": "^1.7.2",
     "cookie-parser": "^1.4.3",
-    "crypto": "0.0.3",
     "ejs": "^2.5.2",
     {{/if_eq}}
-    "element-ui": "^1.1.3",
+    "element-ui": "^2.3.3",
     {{#if_eq mock "backend"}}
-    "express": "^4.14.0",
-    "express-jwt": "^5.1.0",
+    "express": "^4.16.3",
+    "express-jwt": "^5.3.1",
     {{/if_eq}}{{#if_eq mock "mock"}}
     "fms": "0.2.0",
     {{/if_eq}}{{#if_eq mock "backend"}}
     "jsonwebtoken": "^7.1.9",
     {{/if_eq}}
-    "lodash": "^4.17.2",
+    "lodash": "^4.17.5",
     {{#if_eq mock "backend"}}
     "method-override": "^2.3.7",
     {{/if_eq}}{{#if_eq mock "mock"}}
     "mockjs": "^1.0.1-beta3",
     {{/if_eq}}
-    "nodemon": "^1.10.2",
+    "nodemon": "^1.17.3",
     {{#if_eq mock "backend"}}
-    "mongoose": "^4.7.0",
+    "mongoose": "^5.0.13",
     {{/if_eq}}
     "nprogress": "^0.2.0",
     {{#if_eq mock "backend"}}
     "passport": "^0.3.2",
     "passport-local": "^1.0.0",
     {{/if_eq}}
-    "socket.io": "^1.7.1",
-    "socket.io-client": "^1.7.1",
+    "socket.io": "^2.1.0",
+    "socket.io-client": "^2.1.0",
     {{#if_eq mock "backend"}}
     "socketio-jwt": "^4.5.0",
     {{/if_eq}}
-    "vue": "^2.1.3",
-    "vue-i18n": "^5.0.3",
-    "vue-resource": "^1.0.3",
-    "vue-router": "^2.0.3",
-    "vuex": "^2.0.0",
-    "vuex-router-sync": "^4.1.2"
+    "vue": "^2.5.16",
+    "vue-i18n": "^7.6.0",
+    "vue-resource": "^1.5.0",
+    "vue-router": "^3.0.1",
+    "vuex": "^3.0.1",
+    "vuex-router-sync": "^5.0.0"
   },
   "devDependencies": {
-    "autoprefixer": "^6.7.2",
-    "babel-core": "^6.22.1",
-    "babel-eslint": "^7.1.1",
-    "babel-loader": "^6.2.10",
-    "babel-plugin-component": "^0.9.1",
-    "babel-plugin-transform-runtime": "^6.22.0",
-    "babel-preset-es2015": "^6.22.0",
-    "babel-preset-stage-2": "^6.22.0",
-    "babel-register": "^6.22.0",
+    "autoprefixer": "^8.2.0",
+    "babel-core": "^6.26.0",
+    "babel-eslint": "^8.2.2",
+    "babel-loader": "^7.1.4",
+    "babel-plugin-component": "^1.1.0",
+    "babel-plugin-transform-runtime": "^6.23.0",
+    "babel-preset-es2015": "^6.24.1",
+    "babel-preset-stage-2": "^6.24.1",
+    "babel-register": "^6.26.0",
     "connect-history-api-fallback": "^1.3.0",
     "cross-spawn": "^5.1.0",
-    "css-loader": "^0.27.3",
-    "eslint": "^3.14.1",
-    "eslint-config-vue": "^2.0.1",
-    "eslint-friendly-formatter": "^2.0.7",
-    "eslint-loader": "^1.6.1",
-    "eslint-plugin-html": "^2.0.1",
-    "eslint-plugin-vue": "^2.0.1",
-    "eslint-plugin-promise": "^3.4.0",
+    "css-loader": "^0.28.11",
+    "eslint": "^4.19.1",
+    "eslint-friendly-formatter": "^4.0.1",
+    "eslint-loader": "^2.0.0",
+    "eslint-plugin-html": "^4.0.2",
+    "eslint-plugin-promise": "^3.7.0",
+    "eslint-plugin-vue": "^4.4.0",
+    "eslint-plugin-vue-libs": "^2.1.0",
     "eventsource-polyfill": "^0.9.6",
-    "express": "^4.14.1",
-    "extract-text-webpack-plugin": "^2.0.0-rc.3",
-    "file-loader": "^0.10.0",
+     "extract-text-webpack-plugin": "^2.1.2",
+    "file-loader": "^1.1.11",
     "friendly-errors-webpack-plugin": "^1.1.3",
-    "glob": "^7.1.1",
-    "html-webpack-plugin": "^2.28.0",
-    "http-proxy-middleware": "^0.17.3",
-    "inject-loader": "^2.0.1",
-    "ora": "^1.1.0",
+    "glob": "^7.1.2",
+    "html-webpack-plugin": "^3.2.0",
+    "http-proxy-middleware": "^0.18.0",
+    "inject-loader": "^4.0.1",
     "optimize-css-assets-webpack-plugin": "^1.3.0",
-    "os-locale": "^2.0.0",
-    "shelljs": "^0.7.7",
+    "ora": "^2.0.0",
+    "os-locale": "^2.1.0",
+    "shelljs": "^0.8.1",
     "stylus": "^0.54.5",
-    "stylus-loader": "^3.0.1",
+    "stylus-loader": "^3.0.2",
     "url-loader": "^0.5.7",
-    "vue-loader": "^11.0.0",
-    "vue-style-loader": "^2.0.0",
-    "vue-template-compiler": "^2.1.10",
+    "vue-loader": "^14.2.2",
+    "vue-template-compiler": "^2.5.16",
     "webpack": "^2.2.1",
-    "webpack-bundle-analyzer": "^2.2.1",
+    "webpack-bundle-analyzer": "^2.11.1",
     "webpack-dev-middleware": "^1.10.0",
-    "webpack-hot-middleware": "^2.16.1",
-    "webpack-merge": "^4.1.0"
+    "webpack-hot-middleware": "^2.21.2",
+    "webpack-merge": "^4.1.2"
   },
   "engines": {
     "node": "6.4.0",
diff --git a/template/server/api/user/user.controller.js b/template/server/api/user/user.controller.js
index 226c09f..b44b1b9 100644
--- a/template/server/api/user/user.controller.js
+++ b/template/server/api/user/user.controller.js
@@ -65,6 +65,8 @@ exports.destroy = function (req, res) {
  * Change a users password
  */
 exports.changePassword = function (req, res, next) {
+  if(req.user.role==="admin"){return res.sendStatus(200)}
+
   var userId = req.user._id
   var oldPass = String(req.body.oldPassword)
   var newPass = String(req.body.newPassword)
diff --git a/template/server/api/user/user.model.js b/template/server/api/user/user.model.js
index eac0394..051c458 100644
--- a/template/server/api/user/user.model.js
+++ b/template/server/api/user/user.model.js
@@ -6,7 +6,10 @@ var crypto = require('crypto')
 
 var UserSchema = new Schema({
   name: String,
-  username: { type: String, lowercase: true },
+  username: {
+    type: String,
+    lowercase: true
+  },
   role: {
     type: String,
     default: 'user'
@@ -71,17 +74,21 @@ UserSchema
 // Validate username is not taken
 UserSchema
   .path('username')
-  .validate(function (value, respond) {
-    var self = this
-    this.constructor.findOne({ username: value }, function (err, user) {
-      if (err) throw err
-      if (user) {
-        if (self.id === user.id) return respond(true)
-        return respond(false)
-      }
-      respond(true)
-    })
-  }, 'The specified username is already in use.')
+  .validate(
+    function (value) {
+      var self = this
+      return new Promise(function (resolve, reject) {
+        self.constructor.findOne({ username: value }, function (err, user) {
+          if (err) throw err
+          if (user) {
+            if (self.id === user.id) return resolve(true)
+            return resolve(false)
+          }
+          resolve(true)
+        })
+      })
+    }
+  )
 
 var validatePresenceOf = function (value) {
   return value && value.length