Add eslint-plugin-vue

.editorconfig

@@ -0,0 +1,11 @@
+[*.{js,jsx,ts,tsx,vue}]
+indent_style = space
+indent_size = 2
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.{js,jsx,ts,tsx,vue}]
+indent_style = space
+indent_size = 2
+trim_trailing_whitespace = true
+insert_final_newline = true

.eslintrc.js

@@ -0,0 +1,21 @@
+module.exports = {
+    root: true,
+
+    env: {
+        node: true
+    },
+
+    parserOptions: {
+        ecmaVersion: 2020
+    },
+
+    rules: {
+        'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
+        'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
+    },
+
+    extends: [
+        'plugin:vue/essential',
+        '@vue/standard'
+    ]
+}

package.json

@@ -1,17 +1,17 @@
 {
   "name": "noisedash",
   "version": "1.0.0",
+  "private": true,
   "description": "Self-hosted web ambient noise generator",
   "author": "KevinThomas0 <me@kevinthomas.dev>",
-    "private": true,
   "scripts": {
+    "build": "node build/build.js",
+    "lint": "vue-cli-service lint",
     "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
-        "start": "npm run dev",
-        "unit": "jest --config test/unit/jest.conf.js --coverage",
-        "test": "npm run unit",
-        "lint": "eslint --ext .js,.vue src test/unit",
     "server": "node server/app",
-        "build": "node build/build.js"
+    "start": "npm run dev",
+    "test": "npm run unit",
+    "unit": "jest --config test/unit/jest.conf.js --coverage"
   },
   "dependencies": {
     "axios": "^0.21.1",
@@ -22,6 +22,8 @@
     "vue-router": "^3.0.1"
   },
   "devDependencies": {
+    "@vue/cli-plugin-eslint": "^4.5.13",
+    "@vue/eslint-config-standard": "^5.1.2",
     "autoprefixer": "^7.1.2",
     "babel-core": "^6.22.1",
     "babel-eslint": "^8.2.1",
@@ -38,15 +40,13 @@
     "chalk": "^2.0.1",
     "copy-webpack-plugin": "^4.0.1",
     "css-loader": "^0.28.0",
-        "eslint": "^4.15.0",
+    "eslint": "^6.7.2",
-        "eslint-config-standard": "^10.2.1",
+    "eslint-friendly-formatter": "^4.0.1",
-        "eslint-friendly-formatter": "^3.0.0",
+    "eslint-plugin-import": "^2.20.2",
-        "eslint-loader": "^1.7.1",
+    "eslint-plugin-node": "^11.1.0",
-        "eslint-plugin-import": "^2.7.0",
+    "eslint-plugin-promise": "^4.2.1",
-        "eslint-plugin-node": "^5.2.0",
+    "eslint-plugin-standard": "^4.0.0",
-        "eslint-plugin-promise": "^3.4.0",
+    "eslint-plugin-vue": "^6.2.2",
-        "eslint-plugin-standard": "^3.0.1",
-        "eslint-plugin-vue": "^4.0.0",
     "extract-text-webpack-plugin": "^3.0.0",
     "file-loader": "^1.1.4",
     "friendly-errors-webpack-plugin": "^1.6.1",
@@ -74,13 +74,13 @@
     "webpack-dev-server": "^2.9.1",
     "webpack-merge": "^4.1.0"
   },
-    "engines": {
-        "node": ">= 6.0.0",
-        "npm": ">= 3.0.0"
-    },
   "browserslist": [
     "> 1%",
     "last 2 versions",
     "not ie <= 8"
-    ]
+  ],
+  "engines": {
+    "node": ">= 6.0.0",
+    "npm": ">= 3.0.0"
+  }
 }

src/components/Admin.vue

@@ -7,12 +7,12 @@
 
 <script>
 export default {
-  data() {
+  data () {
     return {
-      msg: "The superheros",
+      msg: 'The superheros'
-    };
+    }
-  },
+  }
-};
+}
 </script>
 <style scoped>
 h1,

src/components/HelloWorld.vue

@@ -7,12 +7,12 @@
 
 <script>
 export default {
-  data() {
+  data () {
     return {
-      msg: "Hello World!",
+      msg: 'Hello World!'
-    };
+    }
-  },
+  }
-};
+}
 </script>
     <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped>

src/components/Login.vue

@@ -21,44 +21,44 @@
 
 <script>
 export default {
-  data() {
+  data () {
     return {
-      email: "",
+      email: '',
-      password: "",
+      password: ''
-    };
+    }
   },
   methods: {
-    handleSubmit(e) {
+    handleSubmit (e) {
-      e.preventDefault();
+      e.preventDefault()
       if (this.password.length > 0) {
         this.$http
-          .post("http://localhost:3000/login", {
+          .post('http://localhost:3000/login', {
             email: this.email,
-            password: this.password,
+            password: this.password
           })
           .then((response) => {
-            let is_admin = response.data.user.is_admin;
+            const isAdmin = response.data.user.isAdmin
-            localStorage.setItem("user", JSON.stringify(response.data.user));
+            localStorage.setItem('user', JSON.stringify(response.data.user))
-            localStorage.setItem("jwt", response.data.token);
+            localStorage.setItem('jwt', response.data.token)
 
-            if (localStorage.getItem("jwt") != null) {
+            if (localStorage.getItem('jwt') != null) {
-              this.$emit("loggedIn");
+              this.$emit('loggedIn')
               if (this.$route.params.nextUrl != null) {
-                this.$router.push(this.$route.params.nextUrl);
+                this.$router.push(this.$route.params.nextUrl)
               } else {
-                if (is_admin == 1) {
+                if (isAdmin === 1) {
-                  this.$router.push("admin");
+                  this.$router.push('admin')
                 } else {
-                  this.$router.push("dashboard");
+                  this.$router.push('dashboard')
                 }
               }
             }
           })
           .catch(function (error) {
-            console.error(error.response);
+            console.error(error.response)
-          });
+          })
       }
-    },
+    }
-  },
+  }
-};
+}
 </script>

src/components/Register.vue

@@ -29,7 +29,7 @@
 
       <label for="password-confirm">Is this an administrator account?</label>
       <div>
-        <select v-model="is_admin">
+        <select v-model="isAdmin">
           <option value="1">Yes</option>
           <option value="0">No</option>
         </select>
@@ -44,57 +44,58 @@
 
 <script>
 export default {
-  props: ["nextUrl"],
+  props: ['nextUrl'],
-  data() {
+  data () {
     return {
-      name: "",
+      name: '',
-      email: "",
+      email: '',
-      password: "",
+      password: '',
-      password_confirmation: "",
+      password_confirmation: '',
-      is_admin: null,
+      isAdmin: null
-    };
+    }
   },
   methods: {
-    handleSubmit(e) {
+    handleSubmit (e) {
-      e.preventDefault();
+      e.preventDefault()
 
       if (
         this.password === this.password_confirmation &&
         this.password.length > 0
       ) {
-        let url = "http://localhost:3000/register";
+        let url = 'http://localhost:3000/register'
-        if (this.is_admin != null || this.is_admin == 1)
+        if (this.isAdmin != null || this.isAdmin === 1) {
-          url = "http://localhost:3000/register-admin";
+          url = 'http://localhost:3000/register-admin'
+        }
         this.$http
           .post(url, {
             name: this.name,
             email: this.email,
             password: this.password,
-            is_admin: this.is_admin,
+            isAdmin: this.isAdmin
           })
           .then((response) => {
-            localStorage.setItem("user", JSON.stringify(response.data.user));
+            localStorage.setItem('user', JSON.stringify(response.data.user))
-            localStorage.setItem("jwt", response.data.token);
+            localStorage.setItem('jwt', response.data.token)
 
-            if (localStorage.getItem("jwt") != null) {
+            if (localStorage.getItem('jwt') != null) {
-              this.$emit("loggedIn");
+              this.$emit('loggedIn')
               if (this.$route.params.nextUrl != null) {
-                this.$router.push(this.$route.params.nextUrl);
+                this.$router.push(this.$route.params.nextUrl)
               } else {
-                this.$router.push("/");
+                this.$router.push('/')
               }
             }
           })
           .catch((error) => {
-            console.error(error);
+            console.error(error)
-          });
+          })
       } else {
-        this.password = "";
+        this.password = ''
-        this.passwordConfirm = "";
+        this.passwordConfirm = ''
 
-        return alert("Passwords do not match");
+        return alert('Passwords do not match')
       }
-    },
+    }
-  },
+  }
-};
+}
 </script>

src/components/UserBoard.vue

@@ -7,12 +7,12 @@
 
 <script>
 export default {
-  data() {
+  data () {
     return {
-      msg: "The commoners",
+      msg: 'The commoners'
-    };
+    }
-  },
+  }
-};
+}
 </script>
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->

src/main.js

@@ -5,7 +5,7 @@ import App from './App'
 import router from './router'
 import Axios from 'axios'
 
-Vue.prototype.$http = Axios;
+Vue.prototype.$http = Axios
 
 Vue.config.productionTip = false
 

src/router/index.js

@@ -8,7 +8,7 @@ import Admin from '@/components/Admin'
 
 Vue.use(Router)
 
-let router = new Router({
+const router = new Router({
   mode: 'history',
   routes: [
     {
@@ -46,9 +46,9 @@ let router = new Router({
       component: Admin,
       meta: {
         requiresAuth: true,
-                is_admin: true
+        isAdmin: true
+      }
     }
-        },
   ]
 })
 
@@ -60,12 +60,11 @@ router.beforeEach((to, from, next) => {
         params: { nextUrl: to.fullPath }
       })
     } else {
-            let user = JSON.parse(localStorage.getItem('user'))
+      const user = JSON.parse(localStorage.getItem('user'))
-            if (to.matched.some(record => record.meta.is_admin)) {
+      if (to.matched.some(record => record.meta.isAdmin)) {
-                if (user.is_admin == 1) {
+        if (user.isAdmin === 1) {
           next()
-                }
+        } else {
-                else {
           next({ name: 'userboard' })
         }
       } else {
@@ -75,8 +74,7 @@ router.beforeEach((to, from, next) => {
   } else if (to.matched.some(record => record.meta.guest)) {
     if (localStorage.getItem('jwt') == null) {
       next()
-        }
+    } else {
-        else {
       next({ name: 'userboard' })
     }
   } else {