sourceboat / pug-lint-vue Goto Github PK
View Code? Open in Web Editor NEWCommand line tool to lint Pug templates in Vue single file components.
License: MIT License
Command line tool to lint Pug templates in Vue single file components.
License: MIT License
Say I get this:
assets/vue/admin-bank-create.vue
38:1 Invalid indentation
49:1 Invalid indentation
59:1 Invalid indentation
The problem is that all my templates are after the scripts, so in this file, the <template>
tag is on line 262, and the first invalid indentation is in fact on line 299, not 38.
I have a test.vue file have a custom element like this
<template>
<div>
<mycomponent></mycomponent>
</div>
</template>
<script></script>
<style scoped></style>
it should skip pug-lint-vue
but it will got error
λ yarn pug-lint-vue pages/test.vue
yarn pug-lint-vue v0.21.3
$ "C:\Users\ausir\vts\node_modules\.bin\pug-lint-vue" pages/test.vue
C:\Users\ausir\vts\node_modules\domutils\lib\querying.js:89
if(elems[i].children.length > 0){
^
TypeError: Cannot read property 'length' of undefined
at findAll (C:\Users\ausir\vts\node_modules\domutils\lib\querying.js:89:23)
at findAll (C:\Users\ausir\vts\node_modules\domutils\lib\querying.js:90:27)
at Object.findAll (C:\Users\ausir\vts\node_modules\domutils\lib\querying.js:90:27)
at selectAll (C:\Users\ausir\vts\node_modules\css-select\index.js:26:70)
at select (C:\Users\ausir\vts\node_modules\css-select\index.js:21:10)
at CSSselect (C:\Users\ausir\vts\node_modules\css-select\index.js:41:9)
at initialize.exports.find (C:\Users\ausir\vts\node_modules\cheerio\lib\api\traversing.js:40:21)
at initialize.module.exports (C:\Users\ausir\vts\node_modules\cheerio\lib\cheerio.js:86:18)
at new initialize (C:\Users\ausir\vts\node_modules\cheerio\lib\static.js:29:20)
at initialize (C:\Users\ausir\vts\node_modules\cheerio\lib\static.js:26:14)
error Command failed with exit code 1.
if I delete that custom element , pug-lint-vue work well .
but, sometimes I will import some vue component , that use html and custom element ....
how can I fix it ?
thanks.
Hi, thanks for making this tool! It would be very cool to have a webpack loader for *.vue
files that would lint pug templates.
There's been an effort to make a loader like this: pug-lint-loader
. However, it doesn't seem to work with *.vue
files, only with plain *.pug
/*.jade
files.
Hey there
The following command:
$ (master) pug-lint-vue src/components/LayoutFooter.vue
Gives me:
/usr/lib/node_modules/pug-lint-vue/node_modules/domutils/lib/querying.js:89
if(elems[i].children.length > 0){
^
TypeError: Cannot read property 'length' of undefined
at Object.findAll (/usr/lib/node_modules/pug-lint-vue/node_modules/domutils/lib/querying.js:89:23)
at selectAll (/usr/lib/node_modules/pug-lint-vue/node_modules/css-select/index.js:26:70)
at select (/usr/lib/node_modules/pug-lint-vue/node_modules/css-select/index.js:21:10)
at CSSselect (/usr/lib/node_modules/pug-lint-vue/node_modules/css-select/index.js:41:9)
at initialize.exports.find (/usr/lib/node_modules/pug-lint-vue/node_modules/cheerio/lib/api/traversing.js:40:21)
at initialize.module.exports (/usr/lib/node_modules/pug-lint-vue/node_modules/cheerio/lib/cheerio.js:86:18)
at new initialize (/usr/lib/node_modules/pug-lint-vue/node_modules/cheerio/lib/static.js:29:20)
at initialize (/usr/lib/node_modules/pug-lint-vue/node_modules/cheerio/lib/static.js:26:14)
at DefaultHandler.htmlparser.DefaultHandler [as _callback] (/usr/lib/node_modules/pug-lint-vue/lib/linter.js:68:36)
at DefaultHandler$handleCallback [as handleCallback] (/usr/lib/node_modules/pug-lint-vue/node_modules/htmlparser/lib/htmlparser.js:644:9)
It's looks like this other linter issue.
I will make a PR :)
This lints fine:
el-form.inline(
v-bind:model='form'
v-bind:rules='rules'
v-bind:ref='formName'
method='post'
action=''
label-position='top'
status-icon
v-on:submit.native.prevent='submitForm($event)'
novalidate
)
This throws an 'Unexpected token' error at the line containing the ':rules' parameter (oddly enough, the previous line with the ':model' parameter is fine)
el-form.inline(
:model='form'
:rules='rules'
:ref='formName'
method='post'
action=''
label-position='top'
status-icon
@submit.native.prevent='submitForm($event)'
novalidate
)
Is this an issue with pug-lint itself, or is it something you can affect with this package?
Cheers!
Hello,
Just wanted to let you know that pug-lint-vue
has been added as a checker for syntastic (syntax checked plugin for vim) for .vue
files.
Thanks for your work on this project
I'm using v0.3.0.
About this template example,
<template>
b-textarea(
rows='20'
:value='body'
:loading='isProcessing'
@input='inputBody'
required
)
</template>
and set this .pug-lintrc.js
,
module.exports = {
validateAttributeSeparator: {
separator: ', ',
multiLineSeparator: '\n'
}
}
This case reports this:
4:3 Invalid attribute separator found
5:3 Invalid attribute separator found
6:3 Invalid attribute separator found
It means that :
and @
occurred Invalid attribute separator found
errors.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.