Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added stylelint configuration. #842

Open
wants to merge 35 commits into
base: develop
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 20 commits
Commits
Show all changes
35 commits
Select commit Hold shift + click to select a range
926cb92
Added base stylelint configuration.
blake-newman Jun 6, 2016
8aded35
rename meta.json
Aug 7, 2017
3bc1e6d
Merge branch 'master' into feature/stylint
Aug 7, 2017
e4ebec9
fix meta.js
Aug 7, 2017
292c84d
fix eslint
Aug 7, 2017
4bda3d6
fix stylelint cli usage
Aug 7, 2017
79bf95e
lint-on-save for stylelint
Aug 7, 2017
51081c7
fix stylelint errors
Aug 8, 2017
0a541d4
Merge branch 'master' into feature/stylint
Aug 28, 2017
148be44
install stylelint from stylelint
Aug 28, 2017
71ea681
an => a
Aug 31, 2017
c663db3
ESLint => stylelint
Aug 31, 2017
347a1a4
Update package.json
gucong3000 Sep 5, 2017
bfea365
artifacts for circleci
Sep 5, 2017
1983127
Merge remote-tracking branch 'origin/master' into feature/stylint
Sep 5, 2017
8f44031
use bash script to do artifacts job
Sep 5, 2017
47c9129
test stylelint HEAD
Sep 12, 2017
1611f2a
fix package.json
Sep 12, 2017
fbbadf0
Merge remote-tracking branch 'vuejs-templates/master' into feature/st…
Sep 12, 2017
b414930
Add more stylelint preset
Sep 12, 2017
3b1064e
typo in URL.
Sep 18, 2017
d5fd8f3
Merge remote-tracking branch 'vuejs-templates/master' into feature/st…
Oct 9, 2017
7de3a4e
fix lint errors
Oct 10, 2017
5b138f3
Simplify elementCount custom assertions (#898)
robwierzbowski Nov 21, 2017
3c15450
Merge branch 'develop'
LinusBorg Nov 21, 2017
3cbf82a
Merge remote-tracking branch 'vuejs-templates/master' into feature/st…
gucong3000 Nov 24, 2017
5424ed8
Update `stylelint`
gucong3000 Nov 27, 2017
43de546
Merge branch 'develop' into feature/stylint
gucong3000 Dec 4, 2017
47bab50
Merge branch 'develop' into feature/stylint
gucong3000 Dec 4, 2017
d10dfec
update dependencies
gucong3000 Dec 4, 2017
8593d5b
Merge branch 'develop' into feature/stylint
gucong3000 Dec 5, 2017
a3df122
Merge branch 'develop' into feature/stylint
gucong3000 Dec 18, 2017
476a8e2
Fix `runLintFix`
gucong3000 Dec 18, 2017
e5d2c78
fix config of StyleLintPlugin
gucong3000 Dec 18, 2017
4532c2b
Merge branch 'develop' into feature/stylint
gucong3000 Jan 19, 2018
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions circle.yml
Original file line number Diff line number Diff line change
Expand Up @@ -11,3 +11,9 @@ dependencies:
test:
override:
- bash test.sh
post:
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey @gucong3000 Can you explain to me what this post hook does? I'm horrbile with bash.

Copy link
Contributor Author

@gucong3000 gucong3000 Dec 6, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Move files from ./test/**/* to here:
image

Then we can download them.

- for x in test/* test/.[!.]* test/..?*; do
if [ -e "$x" ] && [ $x != "test/node_modules" ]; then
mv -- "$x" $CIRCLE_ARTIFACTS/;
fi
done
16 changes: 15 additions & 1 deletion docs/linter.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
# Linter Configuration

This boilerplate uses [ESLint](http://eslint.org/) as the linter, and uses the [Standard](https://github.com/feross/standard/blob/master/RULES.md) preset with some small customizations.
## ESLint
This boilerplate uses [ESLint](http://eslint.org/) for JavaScript linting, and uses the [Standard](https://github.com/feross/standard/blob/master/RULES.md) preset with some small customizations.

If you are not happy with the default linting rules, you have several options:

Expand All @@ -14,3 +15,16 @@ If you are not happy with the default linting rules, you have several options:
2. Pick a different ESLint preset when generating the project, for example [eslint-config-airbnb](https://github.com/airbnb/javascript/tree/master/packages/eslint-config-airbnb).

3. Pick "none" for ESLint preset when generating the project and define your own rules. See [ESLint documentation](http://eslint.org/docs/rules/) for more details.

## stylelint
This boilerplate uses [stylelint](http://stylint.io/) as for style linting, and uses the [Standard](https://github.com/stylelint/stylelint-config-standard) preset.
Copy link

@KarboniteKream KarboniteKream Sep 16, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You have a typo in the stylelint URL.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you.
fixed.


If you are not happy with the default linting rules, you have several options:

1. Overwrite individual rules in `.stylelintrc.js`. For example, you can add the following rule to enforce tabs.

``` js
"indentation": "tab",
```

2. Pick "none" for stylelint preset when generating the project and define your own rules. See [Stylelint documentation](http://stylelint.io/user-guide/rules/) for more details.
1 change: 1 addition & 0 deletions docs/structure.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@
├── .babelrc # babel config
├── .postcssrc.js # postcss config
├── .eslintrc.js # eslint config
├── .stylelintrc.js # stylelint config
├── .editorconfig # editor config
├── index.html # index.html template
└── package.json # build scripts and dependencies
Expand Down
43 changes: 38 additions & 5 deletions meta.js
Original file line number Diff line number Diff line change
Expand Up @@ -44,12 +44,12 @@ module.exports = {
"type": "confirm",
"message": "Install vue-router?"
},
"lint": {
"eslint": {
"type": "confirm",
"message": "Use ESLint to lint your code?"
},
"lintConfig": {
"when": "lint",
"eslintConfig": {
"when": "eslint",
"type": "list",
"message": "Pick an ESLint preset",
"choices": [
Expand All @@ -70,6 +70,37 @@ module.exports = {
}
]
},
"stylelint": {
"type": "confirm",
"message": "Use stylelint to lint your code?"
},
"stylelintConfig": {
"when": "stylelint",
"type": "list",
"message": "Pick a stylelint preset",
"choices": [
{
"name": "Standard (https://github.com/stylelint/stylelint-config-standard)",
"value": "standard",
"short": "Standard"
},
{
"name": "Recommended (https://github.com/stylelint/stylelint-config-recommended)",
"value": "recommended",
"short": "Recommended"
},
{
"name": "Wikimedia (https://github.com/wikimedia/stylelint-config-wikimedia)",
"value": "wikimedia",
"short": "Wikimedia"
},
{
"name": "none (configure it yourself)",
"value": "none",
"short": "none"
}
]
},
"unit": {
"type": "confirm",
"message": "Setup unit tests with Karma + Mocha?"
Expand All @@ -80,8 +111,10 @@ module.exports = {
}
},
"filters": {
".eslintrc.js": "lint",
".eslintignore": "lint",
".eslintrc.js": "eslint",
".eslintignore": "eslint",
".stylelintrc.js": "stylelint",
".stylelintignore": "stylelint",
"config/test.env.js": "unit || e2e",
"test/unit/**/*": "unit",
"build/webpack.test.conf.js": "unit",
Expand Down
10 changes: 5 additions & 5 deletions template/.eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,18 +9,18 @@ module.exports = {
env: {
browser: true,
},
{{#if_eq lintConfig "standard"}}
{{#if_eq eslintConfig "standard"}}
// https://github.com/standard/standard/blob/master/docs/RULES-en.md
extends: 'standard',
{{/if_eq}}
{{#if_eq lintConfig "airbnb"}}
{{#if_eq eslintConfig "airbnb"}}
extends: 'airbnb-base',
{{/if_eq}}
// required to lint *.vue files
plugins: [
'html'
],
{{#if_eq lintConfig "airbnb"}}
{{#if_eq eslintConfig "airbnb"}}
// check if imports actually resolve
'settings': {
'import/resolver': {
Expand All @@ -32,13 +32,13 @@ module.exports = {
{{/if_eq}}
// add your custom rules here
'rules': {
{{#if_eq lintConfig "standard"}}
{{#if_eq eslintConfig "standard"}}
// allow paren-less arrow functions
'arrow-parens': 0,
// allow async-await
'generator-star-spacing': 0,
{{/if_eq}}
{{#if_eq lintConfig "airbnb"}}
{{#if_eq eslintConfig "airbnb"}}
// don't require .vue extension when importing
'import/extensions': ['error', 'always', {
'js': 'never',
Expand Down
14 changes: 14 additions & 0 deletions template/.stylelintrc.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
module.exports = {
{{#if_eq eslintConfig "standard"}}
extends: 'stylelint-config-standard',
{{/if_eq}}
{{#if_eq eslintConfig "recommended"}}
extends: 'stylelint-config-recommended',
{{/if_eq}}
{{#if_eq eslintConfig "wikimedia"}}
extends: 'stylelint-config-wikimedia',
{{/if_eq}}
// add your custom rules here
rules: {
}
};
20 changes: 18 additions & 2 deletions template/build/webpack.base.conf.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,9 @@ var path = require('path')
var utils = require('./utils')
var config = require('../config')
var vueLoaderConfig = require('./vue-loader.conf')
{{#stylelint}}
var StyleLintPlugin = require('stylelint-webpack-plugin');
{{/stylelint}}

function resolve (dir) {
return path.join(__dirname, '..', dir)
Expand All @@ -18,6 +21,19 @@ module.exports = {
? config.build.assetsPublicPath
: config.dev.assetsPublicPath
},
{{#stylelint}}
plugins: [
// Stylelint for all imports
// https://github.com/vieron/stylelint-webpack-plugin
new StyleLintPlugin({
configFile: resolve('.stylelintrc.js'),
context: 'inherits from webpack',
files: '../src/**/*.(vue|html?|css|sss|less|scss|sass)',
failOnError: false,
syntax: require('postcss-html'),
})
],
{{/stylelint}}
resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
Expand All @@ -29,7 +45,7 @@ module.exports = {
},
module: {
rules: [
{{#lint}}
{{#eslint}}
{
test: /\.(js|vue)$/,
loader: 'eslint-loader',
Expand All @@ -39,7 +55,7 @@ module.exports = {
formatter: require('eslint-friendly-formatter')
}
},
{{/lint}}
{{/eslint}}
{
test: /\.vue$/,
loader: 'vue-loader',
Expand Down
34 changes: 26 additions & 8 deletions template/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,10 @@
"build": "node build/build.js"{{#unit}},
"unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run"{{/unit}}{{#e2e}},
"e2e": "node test/e2e/runner.js"{{/e2e}}{{#if_or unit e2e}},
"test": "{{#unit}}npm run unit{{/unit}}{{#unit}}{{#e2e}} && {{/e2e}}{{/unit}}{{#e2e}}npm run e2e{{/e2e}}"{{/if_or}}{{#lint}},
"lint": "eslint --ext .js,.vue src{{#unit}} test/unit/specs{{/unit}}{{#e2e}} test/e2e/specs{{/e2e}}"{{/lint}}
"test": "{{#unit}}npm run unit{{/unit}}{{#unit}}{{#e2e}} && {{/e2e}}{{/unit}}{{#e2e}}npm run e2e{{/e2e}}"{{/if_or}}{{#eslint}},
"lint:eslint": "eslint --ext .js,.vue src{{#unit}} test/unit/specs{{/unit}}{{#e2e}} test/e2e/specs{{/e2e}}"{{/eslint}}{{#stylelint}},
"lint:stylelint": "stylelint \"**/*.{vue,htm,html,css,sss,less,scss,sass}\" --custom-syntax postcss-html"{{/stylelint}}{{#if_or eslint stylelint}},
"lint": "{{#eslint}}npm run lint:eslint{{/eslint}}{{#eslint}}{{#stylelint}} && {{/stylelint}}{{/eslint}}{{#stylelint}}npm run lint:stylelint{{/stylelint}}"{{/if_or}}
},
"dependencies": {
"vue": "^2.4.2"{{#router}},
Expand All @@ -20,9 +22,9 @@
"devDependencies": {
"autoprefixer": "^7.1.2",
"babel-core": "^6.22.1",
{{#lint}}
{{#eslint}}
"babel-eslint": "^7.1.1",
{{/lint}}
{{/eslint}}
"babel-loader": "^7.1.1",
"babel-plugin-transform-runtime": "^6.22.0",
"babel-preset-env": "^1.3.2",
Expand All @@ -33,22 +35,22 @@
"copy-webpack-plugin": "^4.0.1",
"css-loader": "^0.28.0",
"cssnano": "^3.10.0",
{{#lint}}
{{#eslint}}
"eslint": "^3.19.0",
"eslint-friendly-formatter": "^3.0.0",
"eslint-loader": "^1.7.1",
"eslint-plugin-html": "^3.0.0",
{{#if_eq lintConfig "standard"}}
{{#if_eq eslintConfig "standard"}}
"eslint-config-standard": "^6.2.1",
"eslint-plugin-promise": "^3.4.0",
"eslint-plugin-standard": "^2.0.1",
{{/if_eq}}
{{#if_eq lintConfig "airbnb"}}
{{#if_eq eslintConfig "airbnb"}}
"eslint-config-airbnb-base": "^11.1.3",
"eslint-import-resolver-webpack": "^0.8.1",
"eslint-plugin-import": "^2.2.0",
{{/if_eq}}
{{/lint}}
{{/eslint}}
"eventsource-polyfill": "^0.9.6",
"express": "^4.14.1",
"extract-text-webpack-plugin": "^2.0.0",
Expand Down Expand Up @@ -76,6 +78,9 @@
"babel-plugin-istanbul": "^4.1.1",
"phantomjs-prebuilt": "^2.1.14",
{{/unit}}
{{#stylelint}}
"postcss-html": "^0.9.0",
{{/stylelint}}
{{#e2e}}
"chromedriver": "^2.27.2",
"cross-spawn": "^5.0.1",
Expand All @@ -84,6 +89,19 @@
{{/e2e}}
"semver": "^5.3.0",
"shelljs": "^0.7.6",
{{#stylelint}}
"stylelint": "github:stylelint/stylelint",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not sure there is a necessary to use github? it has no version control..I think.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm waiting for the next release of stylelint that including stylelint/stylelint#2799.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

stylelint/stylelint#2838
It's going to be released in couple of days.

"stylelint-webpack-plugin": "^0.9.0",
{{#if_eq stylelintConfig "standard"}}
"stylelint-config-standard": "^17.0.0",
{{/if_eq}}
{{#if_eq stylelintConfig "recommended"}}
"stylelint-config-recommended": "^1.0.0",
{{/if_eq}}
{{#if_eq stylelintConfig "wikimedia"}}
"stylelint-config-wikimedia": "^0.4.1",
{{/if_eq}}
{{/stylelint}}
"opn": "^5.1.0",
"optimize-css-assets-webpack-plugin": "^2.0.0",
"ora": "^1.2.0",
Expand Down
10 changes: 5 additions & 5 deletions template/src/App.vue
Original file line number Diff line number Diff line change
Expand Up @@ -11,15 +11,15 @@

<script>
{{#unless router}}
import Hello from './components/Hello'{{#if_eq lintConfig "airbnb"}};{{/if_eq}}
import Hello from './components/Hello'{{#if_eq eslintConfig "airbnb"}};{{/if_eq}}

{{/unless}}
export default {
name: 'app'{{#router}}{{#if_eq lintConfig "airbnb"}},{{/if_eq}}{{else}},
name: 'app'{{#router}}{{#if_eq eslintConfig "airbnb"}},{{/if_eq}}{{else}},
components: {
Hello{{#if_eq lintConfig "airbnb"}},{{/if_eq}}
}{{#if_eq lintConfig "airbnb"}},{{/if_eq}}{{/router}}
}{{#if_eq lintConfig "airbnb"}};{{/if_eq}}
Hello{{#if_eq eslintConfig "airbnb"}},{{/if_eq}}
}{{#if_eq eslintConfig "airbnb"}},{{/if_eq}}{{/router}}
}{{#if_eq eslintConfig "airbnb"}};{{/if_eq}}
</script>

<style>
Expand Down
13 changes: 7 additions & 6 deletions template/src/components/Hello.vue
Original file line number Diff line number Diff line change
Expand Up @@ -23,17 +23,18 @@
<script>
export default {
name: 'hello',
data{{#unless_eq lintConfig "airbnb"}} {{/unless_eq}}() {
data{{#unless_eq eslintConfig "airbnb"}} {{/unless_eq}}() {
return {
msg: 'Welcome to Your Vue.js App'{{#if_eq lintConfig "airbnb"}},{{/if_eq}}
}{{#if_eq lintConfig "airbnb"}};{{/if_eq}}
}{{#if_eq lintConfig "airbnb"}},{{/if_eq}}
}{{#if_eq lintConfig "airbnb"}};{{/if_eq}}
msg: 'Welcome to Your Vue.js App'{{#if_eq eslintConfig "airbnb"}},{{/if_eq}}
}{{#if_eq eslintConfig "airbnb"}};{{/if_eq}}
}{{#if_eq eslintConfig "airbnb"}},{{/if_eq}}
}{{#if_eq eslintConfig "airbnb"}};{{/if_eq}}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h1, h2 {
h1,
h2 {
font-weight: normal;
}

Expand Down
14 changes: 7 additions & 7 deletions template/src/main.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,13 @@
// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
{{/if_eq}}
import Vue from 'vue'{{#if_eq lintConfig "airbnb"}};{{/if_eq}}
import App from './App'{{#if_eq lintConfig "airbnb"}};{{/if_eq}}
import Vue from 'vue'{{#if_eq eslintConfig "airbnb"}};{{/if_eq}}
import App from './App'{{#if_eq eslintConfig "airbnb"}};{{/if_eq}}
{{#router}}
import router from './router'{{#if_eq lintConfig "airbnb"}};{{/if_eq}}
import router from './router'{{#if_eq eslintConfig "airbnb"}};{{/if_eq}}
{{/router}}

Vue.config.productionTip = false{{#if_eq lintConfig "airbnb"}};{{/if_eq}}
Vue.config.productionTip = false{{#if_eq eslintConfig "airbnb"}};{{/if_eq}}

/* eslint-disable no-new */
new Vue({
Expand All @@ -17,10 +17,10 @@ new Vue({
router,
{{/router}}
{{#if_eq build "runtime"}}
render: h => h(App){{#if_eq lintConfig "airbnb"}},{{/if_eq}}
render: h => h(App){{#if_eq eslintConfig "airbnb"}},{{/if_eq}}
{{/if_eq}}
{{#if_eq build "standalone"}}
template: '<App/>',
components: { App }{{#if_eq lintConfig "airbnb"}},{{/if_eq}}
components: { App }{{#if_eq eslintConfig "airbnb"}},{{/if_eq}}
{{/if_eq}}
}){{#if_eq lintConfig "airbnb"}};{{/if_eq}}
}){{#if_eq eslintConfig "airbnb"}};{{/if_eq}}
16 changes: 8 additions & 8 deletions template/src/router/index.js
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
import Vue from 'vue'{{#if_eq lintConfig "airbnb"}};{{/if_eq}}
import Router from 'vue-router'{{#if_eq lintConfig "airbnb"}};{{/if_eq}}
import Hello from '@/components/Hello'{{#if_eq lintConfig "airbnb"}};{{/if_eq}}
import Vue from 'vue'{{#if_eq eslintConfig "airbnb"}};{{/if_eq}}
import Router from 'vue-router'{{#if_eq eslintConfig "airbnb"}};{{/if_eq}}
import Hello from '@/components/Hello'{{#if_eq eslintConfig "airbnb"}};{{/if_eq}}

Vue.use(Router){{#if_eq lintConfig "airbnb"}};{{/if_eq}}
Vue.use(Router){{#if_eq eslintConfig "airbnb"}};{{/if_eq}}

export default new Router({
routes: [
{
path: '/',
name: 'Hello',
component: Hello{{#if_eq lintConfig "airbnb"}},{{/if_eq}}
}{{#if_eq lintConfig "airbnb"}},{{/if_eq}}
]{{#if_eq lintConfig "airbnb"}},{{/if_eq}}
}){{#if_eq lintConfig "airbnb"}};{{/if_eq}}
component: Hello{{#if_eq eslintConfig "airbnb"}},{{/if_eq}}
}{{#if_eq eslintConfig "airbnb"}},{{/if_eq}}
]{{#if_eq eslintConfig "airbnb"}},{{/if_eq}}
}){{#if_eq eslintConfig "airbnb"}};{{/if_eq}}
Loading