Skip to content
This repository was archived by the owner on Feb 24, 2023. It is now read-only.

Commit c800022

Browse files
Upgrade project
* Upgrade Vue 2 => Vue 3 * Use Vue 3 in demo * Add new eslint rules and fix code style * Use math in SASS
1 parent fb3e54d commit c800022

37 files changed

+43647
-21655
lines changed

.browserslistrc

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
> 1%
22
last 2 versions
3-
not ie <= 8
3+
not dead

.editorconfig

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22
root = true
33

44
[*]
5-
indent_style = tab
6-
indent_size = 4
5+
indent_style = space
6+
indent_size = 2
77
end_of_line = lf
88
charset = utf-8
99
trim_trailing_whitespace = true

.eslintrc.js

Lines changed: 81 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -1,56 +1,84 @@
11
module.exports = {
2-
root: true,
3-
4-
env: {
5-
node: true
6-
},
7-
8-
plugins: ['pug'],
9-
10-
'extends': [
11-
'plugin:vue/recommended'
2+
root: true,
3+
env: {
4+
node: true
5+
},
6+
extends: [
7+
'plugin:vue/vue3-essential',
8+
'@vue/standard',
9+
// '@vue/typescript/recommended'
10+
],
11+
parserOptions: {
12+
ecmaVersion: 2020
13+
},
14+
rules: {
15+
'indent': ['off'],
16+
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
17+
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
18+
'vue/script-indent': ['error', 2, { baseIndent: 1, switchCase: 1 }],
19+
'vue/html-closing-bracket-spacing': ['error', { selfClosingTag: 'never' }],
20+
// 'vue/component-definition-name-casing': ['error', 'kebab-case'],
21+
'vue/singleline-html-element-content-newline': ['off'],
22+
'vue/require-default-prop': ['off'],
23+
'vue/max-attributes-per-line': ['off'],
24+
'vue/no-unused-components': ['warn'],
25+
'no-unused-vars': ['warn'],
26+
'vue/html-self-closing': ['warn', { html: { void: 'always' } }],
27+
'curly': ['error', 'multi-line'],
28+
'arrow-parens': ['warn', 'as-needed'],
29+
'no-return-assign': ['off'],
30+
'require-await': ['off'],
31+
'vue/no-v-html': ['off'],
32+
'quote-props': ['warn', 'consistent-as-needed'],
33+
'vue/order-in-components': ['error', {
34+
order: [
35+
'el',
36+
'name',
37+
'key',
38+
'parent',
39+
'functional',
40+
['delimiters', 'comments'],
41+
['components', 'directives', 'filters'],
42+
'icons',
43+
'extends',
44+
'mixins',
45+
['provide', 'inject'],
46+
'ROUTER_GUARDS',
47+
'layout',
48+
'middleware',
49+
'validations',
50+
'validationConfig',
51+
'scrollToTop',
52+
'transition',
53+
'loading',
54+
'inheritAttrs',
55+
'model',
56+
['props', 'propsData'],
57+
'emits',
58+
'setup',
59+
'asyncData',
60+
'head',
61+
'data',
62+
'fetch',
63+
'computed',
64+
'watch',
65+
'watchQuery',
66+
'LIFECYCLE_HOOKS',
67+
'methods',
68+
['template', 'render'],
69+
'renderError'
70+
]
71+
}]
72+
},
73+
overrides: [
74+
{
75+
files: [
76+
'**/__tests__/*.{j,t}s?(x)',
77+
'**/tests/unit/**/*.spec.{j,t}s?(x)'
78+
],
79+
env: {
80+
jest: true
81+
}
82+
}
1283
],
13-
14-
rules: {
15-
'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
16-
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
17-
'no-multiple-empty-lines': [2, { 'max': 2, 'maxEOF': 1 }],
18-
'no-tabs': 0,
19-
// 'indent': [2, 'tab'],
20-
'indent': 'off',
21-
'vue/script-indent': ['error', 'tab', {
22-
'baseIndent': 1,
23-
'switchCase': 1
24-
}],
25-
'vue/html-indent': ['error', 'tab', {
26-
'attribute': 1,
27-
'baseIndent': 1,
28-
'closeBracket': 0,
29-
'alignAttributesVertically': true,
30-
'ignores': []
31-
}],
32-
'vue/component-name-in-template-casing': 'error',
33-
// single quotes
34-
'quotes': [2, 'single'],
35-
// allow paren-less arrow functions
36-
'arrow-parens': 0,
37-
// allow async-await
38-
'generator-star-spacing': 0
39-
},
40-
41-
parserOptions: {
42-
parser: 'babel-eslint'
43-
},
44-
45-
overrides: [
46-
{
47-
files: [
48-
'**/__tests__/*.{j,t}s?(x)',
49-
'**/tests/unit/**/*.spec.{j,t}s?(x)'
50-
],
51-
env: {
52-
jest: true
53-
}
54-
}
55-
]
5684
}

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ node_modules
1010
npm-debug.log*
1111
yarn-debug.log*
1212
yarn-error.log*
13+
pnpm-debug.log*
1314

1415
# Editor directories and files
1516
.idea

CONTRIBUTING.md

Lines changed: 8 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,9 @@
55
### Pull requests
66
If you would like ot fix a bug or create a new feature, be sure:
77

8-
1. You created a pull request to a proper branch (`master` branch for bug fixes, `develop` branch for features).
9-
2. You put a description about what your code changes.
10-
3. You used [keywords](https://help.github.com/en/github/managing-your-work-on-github/linking-a-pull-request-to-an-issue) to mark related issues in your pull request.
11-
4. You updated the documentation (README file).
8+
1. You put a description about what your code changes.
9+
2. You used [keywords](https://help.github.com/en/github/managing-your-work-on-github/linking-a-pull-request-to-an-issue) to mark related issues in your pull request.
10+
3. You updated the documentation (README file).
1211

1312
### Issues
1413
If you want just request a bug or new feature just use a proper issue template. Describe your expectations as accurately as possible and add a demo from CodePen.
@@ -17,17 +16,17 @@ If you want just request a bug or new feature just use a proper issue template.
1716

1817
```bash
1918
# project setup
20-
yarn install
19+
npm install
2120

2221
# compiles and hot-reloads for development
23-
yarn serve
22+
npm run serve
2423

2524
# compiles and minifies for production
26-
yarn build-bundle
25+
npm run build-bundle
2726

2827
# lint and fixes files
29-
yarn lint --fix
28+
npm run lint --fix
3029

3130
# runs unit tests
32-
yarn test:unit
31+
npm run test:unit
3332
```

README.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -34,13 +34,13 @@ Deprecated props (`arrows`, `prevArrow`, `nextArrow`, `show`) and classes (`.agi
3434
## Installation
3535

3636
```bash
37-
yarn add vue-agile
37+
npm install vue-agile
3838
```
3939

40-
or
40+
or
4141

4242
```bash
43-
npm install vue-agile
43+
yarn add vue-agile
4444
```
4545

4646
## Styles

babel.config.js

Lines changed: 3 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,5 @@
11
module.exports = {
2-
presets: [[
3-
'@vue/app',
4-
{
5-
useBuiltIns: 'usage',
6-
targets: {
7-
browsers: ['>1%', 'last 2 versions'],
8-
ie: '11'
9-
}
10-
}
11-
]]
2+
presets: [
3+
'@vue/cli-plugin-babel/preset'
4+
]
125
}

demo/App.vue

Lines changed: 31 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,42 +1,42 @@
11
<template lang="pug">
2-
main.main
3-
site-header
2+
main.main
3+
site-header
44

5-
// Examples
6-
example-1
7-
example-2
8-
example-3
9-
example-4
5+
// Examples
6+
example-1
7+
example-2
8+
example-3
9+
example-4
1010

11-
site-footer
11+
site-footer
1212

1313
</template>
1414

1515
<script>
16-
import SiteHeader from './components/SiteHeader'
17-
import SiteFooter from './components/SiteFooter'
18-
19-
// Examples
20-
import Example1 from './examples/Example1'
21-
import Example2 from './examples/Example2'
22-
import Example3 from './examples/Example3'
23-
import Example4 from './examples/Example4'
24-
25-
export default {
26-
name: 'Demo',
27-
28-
components: {
29-
SiteHeader,
30-
SiteFooter,
31-
32-
Example1,
33-
Example2,
34-
Example3,
35-
Example4
36-
}
37-
}
16+
import SiteHeader from './components/SiteHeader'
17+
import SiteFooter from './components/SiteFooter'
18+
19+
// Examples
20+
import Example1 from './examples/Example1'
21+
import Example2 from './examples/Example2'
22+
import Example3 from './examples/Example3'
23+
import Example4 from './examples/Example4'
24+
25+
export default {
26+
name: 'Demo',
27+
28+
components: {
29+
SiteHeader,
30+
SiteFooter,
31+
32+
Example1,
33+
Example2,
34+
Example3,
35+
Example4
36+
}
37+
}
3838
</script>
3939

4040
<style lang="scss" type="text/scss">
41-
@import './scss/main.scss';
41+
@import './scss/main.scss';
4242
</style>

demo/components/CodePen.vue

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,23 @@
11
<template lang="pug">
2-
div.codepen(v-if="id")
3-
a(:href="`https://codepen.io/lukaszflorczak/pen/${id}`" target="_blank")
4-
span Edit on
5-
span
6-
| C
7-
i.fab.fa-codepen
8-
| dePen
2+
div.codepen(v-if="id")
3+
a(:href="`https://codepen.io/lukaszflorczak/pen/${id}`" target="_blank")
4+
span Edit on
5+
span
6+
| C
7+
i.fab.fa-codepen
8+
| dePen
99

1010
</template>
1111

1212
<script>
13-
export default {
14-
name: 'CodePen',
13+
export default {
14+
name: 'CodePen',
1515
16-
props: {
17-
id: {
18-
type: String,
19-
default: null
20-
}
21-
}
22-
}
16+
props: {
17+
id: {
18+
type: String,
19+
default: null
20+
}
21+
}
22+
}
2323
</script>

demo/components/SiteFooter.vue

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,23 @@
11
<template lang="pug">
2-
footer.site-footer
3-
div.container
4-
div.row
5-
div.col-xs-12
6-
div.copyright
7-
span Copyright © 2017-2019 #[strong Łukasz Florczak]!{' '}
2+
footer.site-footer
3+
div.container
4+
div.row
5+
div.col-xs-12
6+
div.copyright
7+
span Copyright © 2017-2019 #[strong Łukasz Florczak]!{' '}
88

9-
a(href="https://twitter.com/lukaszflorczak" class="twitter-follow-button" data-show-count="false") Follow @lukaszflorczak
10-
a(href="http://ko-fi.com/lukaszflorczak" target="_blank")
11-
img(src="https://img.shields.io/badge/buy%20me%20a%20coffee-+3€-red.svg?style=flat&logo=ko-fi")
9+
a(href="https://twitter.com/lukaszflorczak" class="twitter-follow-button" data-show-count="false") Follow @lukaszflorczak
10+
a(href="http://ko-fi.com/lukaszflorczak" target="_blank")
11+
img(src="https://img.shields.io/badge/buy%20me%20a%20coffee-+3€-red.svg?style=flat&logo=ko-fi")
1212

13-
div.row
14-
div.col-xs-12
15-
div.license Licensed under the MIT license
13+
div.row
14+
div.col-xs-12
15+
div.license Licensed under the MIT license
1616

1717
</template>
1818

1919
<script>
20-
export default {
21-
name: 'SiteFooter'
22-
}
20+
export default {
21+
name: 'SiteFooter'
22+
}
2323
</script>

0 commit comments

Comments
 (0)