Skip to content

Commit 2719ded

Browse files
Michael Havey - FitzgeraldMichael Havey - Fitzgerald
Michael Havey - Fitzgerald
authored and
Michael Havey - Fitzgerald
committed
chore: use nicer linting
1 parent 8c39b80 commit 2719ded

13 files changed

+957
-645
lines changed

‎.babelrc‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
{
2-
"presets": [
3-
[
4-
"es2015"
5-
]
6-
]
2+
"presets": [
3+
["es2015"]
4+
]
75
}

‎.eslintrc‎

Lines changed: 47 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -4,28 +4,64 @@
44
"mocha": true
55
},
66
"extends": [
7-
"plugin:vue/essential",
8-
"google"
7+
"airbnb-base",
8+
"plugin:vue/essential"
99
],
1010
"parser": "vue-eslint-parser",
1111
"parserOptions": {
1212
"parser": "babel-eslint",
1313
"sourceType": "module"
1414
},
1515
"rules": {
16-
// require semicolons
17-
"semi": ["error", "always"],
16+
// only apply parens to arrow functions when there are multiple args
17+
"arrow-parens": [2, "as-needed"],
1818

19-
// don't concern ourselves with line endings
19+
// never have trailing commas
20+
"comma-dangle": [2, "never"],
21+
22+
// allow require in all sorts of places
23+
"global-require": 0,
24+
25+
// always indent with one tab, including switch statements
26+
"indent": [1, "tab", { "SwitchCase": 1 }],
27+
28+
// don"t worry about line endings
2029
"linebreak-style": 0,
2130

22-
// don't error if no jsdoc provided
23-
"require-jsdoc": 0,
31+
// warn for any line over 140 chars
32+
"max-len": [1, 140],
33+
34+
// class constructors must start with a capital letter, allows Router and Object ID without "new"
35+
"new-cap": [2, { "capIsNewExceptions": ["Router", "ObjectId"] }],
36+
37+
// don"t allow modification of any input parameters
38+
"no-param-reassign": [2, { "props": false }],
39+
40+
// allow the ++ operator
41+
"no-plusplus": 0,
42+
43+
// disallow underscore dangle with the exceptions "_id" & "__v"
44+
"no-underscore-dangle": [2, { "allow": ["_id", "__v"] }],
45+
46+
// allow tabs!
47+
"no-tabs": 0,
48+
49+
// allow objects to be defined on a single line
50+
"object-curly-newline": 0,
51+
52+
// use object shorthand wherever possible
53+
"object-shorthand": ["error", "always"],
54+
55+
// allow indentation regardless of blank lines above and below
56+
"padded-blocks": 0,
57+
58+
// ensure properties are either consistently in / without qutoes as needed
59+
"quote-props": [2, "consistent-as-needed"],
2460

25-
// allow use of "new Vue(...)"
26-
"no-new": 0,
61+
// allow us to use webpack while installing it as a devDepencdency
62+
"import/no-extraneous-dependencies": 0,
2763

28-
// more manageable max line length
29-
"max-len": ["error", { "code": 160 }]
64+
// arrow functions don't need a consistent return type for all code paths
65+
"consistent-return": 0
3066
}
3167
}

‎index.html‎

Lines changed: 68 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -1,76 +1,76 @@
11
<!DOCTYPE html>
22
<html>
3-
<head>
4-
<meta charset="utf-8">
5-
<title>Vue Component</title>
6-
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
7-
<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.slim.min.js"></script>
8-
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
9-
</head>
10-
<body>
11-
<style type="text/css">
12-
.tree-view-item-value-number {
13-
color: green;
14-
}
15-
.tree-view-item-value-string {
16-
color: blue;
17-
}
18-
.tree-view-item-value-boolean {
19-
color: violet;
20-
}
21-
</style>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Vue Component</title>
6+
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
7+
<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.slim.min.js"></script>
8+
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
9+
</head>
10+
<body>
11+
<style type="text/css">
12+
.tree-view-item-value-number {
13+
color: green;
14+
}
15+
.tree-view-item-value-string {
16+
color: blue;
17+
}
18+
.tree-view-item-value-boolean {
19+
color: violet;
20+
}
21+
</style>
2222

23-
<div id="container" class="container">
23+
<div id="container" class="container">
2424

25-
<div class="row">
26-
<div class="col-sm-6">
27-
<h2>Test String, some Max Depth, Named Root Object</h2>
28-
<pre><code>{{sampleJSONString}}</code></pre>
29-
</div>
30-
<div class="col-sm-6">
31-
<tree-view :data="sampleJSONString" :options="{maxDepth: 2, rootObjectKey: 'The Test String'}"></tree-view>
32-
</div>
33-
</div>
34-
<div class="row">
35-
<div class="col-sm-6">
36-
<h2>Test Array, some Max Depth, Named Root Object, and Auto Linking</h2>
37-
<pre><code>{{sampleJSONArray}}</code></pre>
38-
</div>
39-
<div class="col-sm-6">
40-
<tree-view :data="sampleJSONArray" :options="{maxDepth: 2, rootObjectKey: 'The Test Array', link: true}"></tree-view>
41-
</div>
42-
</div>
25+
<div class="row">
26+
<div class="col-sm-6">
27+
<h2>Test String, some Max Depth, Named Root Object</h2>
28+
<pre><code>{{sampleJSONString}}</code></pre>
29+
</div>
30+
<div class="col-sm-6">
31+
<tree-view :data="sampleJSONString" :options="{maxDepth: 2, rootObjectKey: 'The Test String'}"></tree-view>
32+
</div>
33+
</div>
34+
<div class="row">
35+
<div class="col-sm-6">
36+
<h2>Test Array, some Max Depth, Named Root Object, and Auto Linking</h2>
37+
<pre><code>{{sampleJSONArray}}</code></pre>
38+
</div>
39+
<div class="col-sm-6">
40+
<tree-view :data="sampleJSONArray" :options="{maxDepth: 2, rootObjectKey: 'The Test Array', link: true}"></tree-view>
41+
</div>
42+
</div>
4343

44-
<div class="row">
45-
<div class="col-sm-6">
46-
<h2>No Max Depth, Named Root Object</h2>
47-
<pre><code>{{sampleJSON}}</code></pre>
48-
</div>
49-
<div class="col-sm-6">
50-
<tree-view :data="sampleJSON" :options="{maxDepth: 0, rootObjectKey: 'The named Object'}"></tree-view>
51-
</div>
52-
</div>
44+
<div class="row">
45+
<div class="col-sm-6">
46+
<h2>No Max Depth, Named Root Object</h2>
47+
<pre><code>{{sampleJSON}}</code></pre>
48+
</div>
49+
<div class="col-sm-6">
50+
<tree-view :data="sampleJSON" :options="{maxDepth: 0, rootObjectKey: 'The named Object'}"></tree-view>
51+
</div>
52+
</div>
5353

54-
<div class="row">
55-
<div class="col-sm-6">
56-
<h2>Max Depth set to 2</h2>
57-
<pre><code>{{sampleJSON}}</code></pre>
58-
</div>
59-
<div class="col-sm-6">
60-
<tree-view :data="sampleJSON" :options="{maxDepth: 2}"></tree-view>
61-
</div>
62-
</div>
54+
<div class="row">
55+
<div class="col-sm-6">
56+
<h2>Max Depth set to 2</h2>
57+
<pre><code>{{sampleJSON}}</code></pre>
58+
</div>
59+
<div class="col-sm-6">
60+
<tree-view :data="sampleJSON" :options="{maxDepth: 2}"></tree-view>
61+
</div>
62+
</div>
6363

64-
<div class="row">
65-
<div class="col-sm-6">
66-
<h2>Modifiable</h2>
67-
<pre><code>{{sampleJSON}}</code></pre>
68-
</div>
69-
<div class="col-sm-6">
70-
<tree-view :data="sampleJSON" :options="{modifiable: true}" v-on:change-data="onChangeData" ></tree-view>
71-
</div>
72-
</div>
73-
</div>
74-
<script type="text/javascript" src="/build/build.js"></script>
75-
</body>
64+
<div class="row">
65+
<div class="col-sm-6">
66+
<h2>Modifiable</h2>
67+
<pre><code>{{sampleJSON}}</code></pre>
68+
</div>
69+
<div class="col-sm-6">
70+
<tree-view :data="sampleJSON" :options="{modifiable: true}" v-on:change-data="onChangeData" ></tree-view>
71+
</div>
72+
</div>
73+
</div>
74+
<script type="text/javascript" src="/build/build.js"></script>
75+
</body>
7676
</html>

‎index.js‎

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,26 @@
11
import Vue from 'vue';
22
import TreeView from './src/TreeView.vue';
33

4-
new Vue({
5-
el: '#container',
6-
components: {
7-
TreeView,
8-
},
9-
data() {
10-
return {
11-
sampleJSON: {testArray: ['Just a Test String', 'in a Test Array', 0, 1, true, false], component: 'vuejsontreeview', descripton: 'A JSON Tree View built in Vue.js', tags: [{name: 'vue.js'}, {name: 'JSON'}], steps: ['HTML Template', 'Root Component', 'View Component', {'Transformation Logic': ['Transform Objects', 'Transform Arrays', 'Transform Values']}, 'Animate', 'Allow Options', 'Blog about it...']}, // eslint-disable-line max-len
12-
sampleJSONString: 'Just a Test String',
13-
sampleJSONArray: ['Just a Test String', 'in a Test Array', 'www.google.com', 0, 1, true, false],
14-
};
15-
},
16-
methods: {
17-
onChangeData: function(data) {
18-
this.sampleJSON = data;
19-
},
20-
},
21-
watch: {
22-
sampleJSON: function() {
23-
console.log('updated sampleJSON');
24-
},
25-
},
4+
new Vue({ // eslint-disable-line no-new
5+
el: '#container',
6+
components: {
7+
TreeView
8+
},
9+
data() {
10+
return {
11+
sampleJSON: { testArray: ['Just a Test String', 'in a Test Array', 0, 1, true, false], component: 'vuejsontreeview', descripton: 'A JSON Tree View built in Vue.js', tags: [{ name: 'vue.js' }, { name: 'JSON' }], steps: ['HTML Template', 'Root Component', 'View Component', { 'Transformation Logic': ['Transform Objects', 'Transform Arrays', 'Transform Values'] }, 'Animate', 'Allow Options', 'Blog about it...'] }, // eslint-disable-line max-len
12+
sampleJSONString: 'Just a Test String',
13+
sampleJSONArray: ['Just a Test String', 'in a Test Array', 'www.google.com', 0, 1, true, false]
14+
};
15+
},
16+
methods: {
17+
onChangeData(data) {
18+
this.sampleJSON = data;
19+
}
20+
},
21+
watch: {
22+
sampleJSON() {
23+
console.log('updated sampleJSON');
24+
}
25+
}
2626
});

0 commit comments

Comments
 (0)