Updated eslint, jest, and package. Fixed eslint errors

.eslintrc.js

@@ -0,0 +1,9 @@
+module.exports = {
+  extends: ['plugin:vue/recommended', 'plugin:prettier/recommended'],
+  plugins: ['jest', 'prettier'],
+  rules: {
+    eqeqeq:: 0
+    no-cond-assign: 0,
+    quotes: [1, 'single']
+  }
+};

babel.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  presets: ['@vue/cli-plugin-babel/preset']
+};

jest.config.js

@@ -0,0 +1,12 @@
+module.exports = {
+  preset: '@vue/cli-plugin-unit-jest',
+  setupFiles: ['<rootDir>/tests/setupTests.js'],
+  testURL: 'http://localhost:8999',
+  testMatch: ['<rootDir>/tests/*/*.spec.js'],
+  testEnvironmentOptions: {
+    pretendToBeVisual: true
+  },
+  collectCoverage: true,
+  collectCoverageFrom: ['<rootDir>/src/**'],
+  coverageReporters: ['text', 'text-summary']
+};

package.json

@@ -1,87 +1,69 @@
 {
   "name": "liquor-tree",
-  "description": "A Vue.js tree component.",
   "version": "0.2.69",
+  "description": "A Vue.js tree component.",
   "author": "Kostiantyn <[email protected]>",
-  "library": "LiquorTree",
-  "homepage": "https://amsik.github.io/liquor-tree/",
   "scripts": {
+    "lint": "vue-cli-service lint",
+    "test": "vue-cli-service test:unit",
     "dev": "cross-env NODE_ENV=development rollup -w -c rollup.config.js",
     "build": "cross-env NODE_ENV=production rollup -c rollup.config.js",
-    "lint": "eslint --fix src tests",
-    "test": "npm run lint && npm run unit",
-    "unit": "jest",
     "storybook": "start-storybook -p 9001 -c ./docs/storybook -s ./docs/storybook/public"
   },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/amsik/liquor-tree.git"
-  },
-  "module": "dist/liquor-tree.esm.js",
   "main": "dist/liquor-tree.umd.js",
-  "keywords": [
-    "vue",
-    "tree",
-    "component",
-    "vue-tree",
-    "treeview"
-  ],
-  "license": "MIT",
+  "module": "dist/liquor-tree.esm.js",
   "files": [
     "src",
     "dist/*.js"
   ],
+  "dependencies": {},
   "devDependencies": {
     "@rollup/plugin-alias": "^2.2.0",
     "@storybook/addon-notes": "^5.2.8",
     "@storybook/addon-options": "^5.2.8",
     "@storybook/vue": "^5.2.8",
+    "@vue/cli-plugin-babel": "^4.1.1",
+    "@vue/cli-plugin-eslint": "^4.1.1",
+    "@vue/cli-plugin-unit-jest": "^4.1.1",
+    "@vue/cli-service": "^4.1.1",
+    "@vue/eslint-config-prettier": "^6.0.0",
     "@vue/test-utils": "^1.0.0-beta.30",
-    "babel-core": "^6.26.3",
-    "babel-jest": "^25.0.0",
-    "babel-loader": "^8.0.6",
-    "babel-plugin-transform-builtin-extend": "^1.1.2",
-    "babel-preset-env": "^1.7.0",
+    "babel-core": "^7.0.0-bridge.0",
     "canvas": "^2.6.0",
+    "core-js": "^3.4.8",
     "cross-env": "^6.0.3",
     "eslint": "^6.7.2",
     "eslint-plugin-jest": "^23.1.1",
-    "eslint-plugin-vue-libs": "^4.0.0",
-    "jest": "^25.0.0",
+    "eslint-plugin-prettier": "^3.1.1",
+    "eslint-plugin-vue": "^6.0.1",
+    "html-webpack-plugin": "^3.2.0",
+    "prettier": "^1.19.1",
     "rollup": "^1.27.10",
     "rollup-plugin-buble": "^0.19.8",
     "rollup-plugin-serve": "^1.0.1",
     "rollup-plugin-uglify": "^6.0.4",
     "rollup-plugin-vue": "4.6.1",
-    "typescript": "^3.7.3",
     "vue": "^2.6.10",
-    "vue-jest": "^3.0.5",
-    "vue-loader": "^15.7.2",
     "vue-template-compiler": "^2.6.10"
   },
-  "jest": {
-    "testEnvironment": "node",
-    "setupFiles": [
-      "./tests/setupTests.js"
-    ],
-    "moduleFileExtensions": [
-      "js",
-      "vue"
-    ],
-    "moduleNameMapper": {
-      "^@/(.*)$": "<rootDir>/src/$1"
-    },
-    "transform": {
-      "^.+\\.js$": "<rootDir>/node_modules/babel-jest",
-      ".*\\.(vue)$": "<rootDir>/node_modules/vue-jest"
-    },
-    "collectCoverage": true,
-    "collectCoverageFrom": [
-      "./src/**"
-    ],
-    "coverageReporters": [
-      "text",
-      "text-summary"
-    ]
+  "browserslist": [
+    ">= 1%",
+    "last 1 major version",
+    "not dead",
+    "Explorer 11"
+  ],
+  "homepage": "https://amsik.github.io/liquor-tree/",
+  "keywords": [
+    "vue",
+    "tree",
+    "component",
+    "vue-tree",
+    "treeview"
+  ],
+  "library": "LiquorTree",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/amsik/liquor-tree.git"
   }
 }

src/components/TreeNode.vue

@@ -28,15 +28,14 @@
       <ul
         v-if="hasChildren() && node.states.expanded"
         class="tree-children">
+        <template v-for="child in node.children">
           <node
-            v-for="child in node.children"
             v-if="child && child.visible()"
-
             :key="child.id"
             :node="child"
             :options="options"
-            >
-          </node>
+          />
+        </template>
       </ul>
     </transition>
   </li>
@@ -440,6 +439,4 @@
       transform: rotate(360deg);
     }
   }
-
-
-</style>
+</style>

src/components/TreeRoot.vue

@@ -6,24 +6,24 @@
     <template v-else>
       <ul class="tree-root" @dragstart="onDragStart">
         <template v-if="opts.filter.plainList && matches.length > 0">
-          <TreeNode
-            v-for="node in matches"
-            v-if="node.visible()"
-
-            :key="node.id"
-            :node="node"
-            :options="opts"
-          />
+          <template v-for="node in matches">
+            <TreeNode
+              v-if="node.visible()"
+              :key="node.id"
+              :node="node"
+              :options="opts"
+            />
+          </template>
         </template>
         <template v-else>
-          <TreeNode
-            v-for="node in model"
-            v-if="node && node.visible()"
-
-            :key="node.id"
-            :node="node"
-            :options="opts"
-          />
+          <template v-for="node in model">
+            <TreeNode
+              v-if="node && node.visible()"
+              :key="node.id"
+              :node="node"
+              :options="opts"
+            />
+          </template>
         </template>
       </ul>
     </template>
@@ -194,4 +194,4 @@
     bottom: 0;
     transform: translateY(50%);
   }
-</style>
+</style>