@tkskto/vue-component-analyzer
Advanced tools
Comparing version 0.0.6 to 0.1.0
/*! | ||
@tkskto/vue-component-analyzer v0.0.6 | ||
@tkskto/vue-component-analyzer v0.1.0 | ||
https://github.com/tkskto/ | ||
@@ -119,4 +119,3 @@ Released under the MIT License. | ||
class Seed { | ||
constructor(name, level, index) { | ||
this.name = name; | ||
constructor(file, level, index) { | ||
this.level = level; | ||
@@ -126,3 +125,4 @@ this.index = index; | ||
this._duplicate = false; | ||
this._name = name; | ||
this._name = file.name; | ||
this._props = file.props; | ||
this._level = level; | ||
@@ -140,3 +140,7 @@ this._index = index; | ||
} | ||
renderWithProps() { | ||
return `<details><summary>${this._name}</summary><pre>${JSON.stringify(this._props, null, '\t')}</pre></details>`; | ||
} | ||
render() { | ||
const contents = this._props ? this.renderWithProps() : this._name; | ||
let childHTML = ''; | ||
@@ -155,3 +159,3 @@ let seedClassName = ''; | ||
return `<div class="seed${seedClassName}"> | ||
<span class="file"><span class="filename${fileClassName}">${this._name}</span></span> | ||
<span class="file"><span class="filename${fileClassName}">${contents}</span></span> | ||
${childHTML} | ||
@@ -184,3 +188,3 @@ </div>`; | ||
if (data) { | ||
const root = new Seed(entry.name, 0, 0); | ||
const root = new Seed(entry, 0, 0); | ||
this._tree.push(this.generateSeed(entry, root, 0)); | ||
@@ -200,3 +204,3 @@ } | ||
const child = children[i]; | ||
const childSeed = new Seed(child.name, level + 1, i); | ||
const childSeed = new Seed(child, level + 1, i); | ||
childSeeds.push(childSeed); | ||
@@ -203,0 +207,0 @@ this.generateSeed(child, childSeed, level + 1); |
@@ -6,3 +6,3 @@ /** | ||
/*! | ||
@tkskto/vue-component-analyzer v0.0.6 | ||
@tkskto/vue-component-analyzer v0.1.0 | ||
https://github.com/tkskto/ | ||
@@ -41,2 +41,3 @@ Released under the MIT License. | ||
commander.option('-o, --out [dir]', 'output directory (enable with setting --format option to "json" or "both")', 'out'); | ||
commander.option('-p, --port [number]', 'select a port number for the local server', '8888'); | ||
const argv = commander.parse(process.argv); | ||
@@ -61,7 +62,7 @@ if (argv.format !== FORMAT.BROWSER && argv.format !== FORMAT.JSON && argv.format !== FORMAT.BOTH) { | ||
if (argv.format === FORMAT.BOTH) { | ||
server_1.startServer(result); | ||
server_1.startServer(argv.port, result); | ||
writeFileExtra(path_1.default.resolve(process.cwd(), `${argv.out}/result.json`), JSON.stringify(result, null, 4)); | ||
} | ||
else if (argv.format === FORMAT.BROWSER) { | ||
server_1.startServer(result); | ||
server_1.startServer(argv.port, result); | ||
} | ||
@@ -68,0 +69,0 @@ else if (argv.format === FORMAT.JSON) { |
/*! | ||
@tkskto/vue-component-analyzer v0.0.6 | ||
@tkskto/vue-component-analyzer v0.1.0 | ||
https://github.com/tkskto/ | ||
@@ -15,5 +15,4 @@ Released under the MIT License. | ||
const projectRoot = path_1.default.resolve(__dirname, '..'); | ||
exports.startServer = (json) => { | ||
exports.startServer = (port, json) => { | ||
const HOST = '127.0.0.1'; | ||
const PORT = 8888; | ||
const app = express_1.default(); | ||
@@ -35,4 +34,4 @@ app.engine('ejs', require('ejs').renderFile); | ||
}); | ||
server.listen(PORT, HOST, () => { | ||
const addressPort = server.address().port || PORT; | ||
server.listen(port, HOST, () => { | ||
const addressPort = server.address().port || port; | ||
const url = `http://${HOST}:${addressPort}/`; | ||
@@ -39,0 +38,0 @@ console.log(`Vue Component Analyzer is started at ${url}`); |
/*! | ||
@tkskto/vue-component-analyzer v0.0.6 | ||
@tkskto/vue-component-analyzer v0.1.0 | ||
https://github.com/tkskto/ | ||
@@ -7,3 +7,3 @@ Released under the MIT License. | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.getImportDeclarationTree = exports.resolveFile = exports.getImportDeclaration = void 0; | ||
exports.getImportDeclarationTree = exports.resolveFile = exports.getPropsDeclaration = exports.getImportDeclaration = void 0; | ||
const vue_eslint_parser_1 = require("vue-eslint-parser"); | ||
@@ -16,16 +16,55 @@ const fs_1 = require("fs"); | ||
}; | ||
exports.getPropsDeclaration = (tokens) => { | ||
let isPropsToken = false; | ||
let result = '{'; | ||
let closedCount = 0; | ||
const needQuotingTypes = ['Identifier', 'Boolean', 'Keyword']; | ||
for (const token of tokens) { | ||
const { type, value } = token; | ||
if (isPropsToken || (type === 'Identifier' && value === 'props')) { | ||
const needQuoting = needQuotingTypes.includes(type); | ||
isPropsToken = true; | ||
if (type === 'Punctuator') { | ||
if (value === '{') { | ||
closedCount++; | ||
} | ||
else if (value === '}') { | ||
closedCount--; | ||
if (result[result.length - 1] === ',') { | ||
result = result.slice(0, -1); | ||
} | ||
if (closedCount === 0) { | ||
result += '}'; | ||
break; | ||
} | ||
} | ||
} | ||
if (needQuoting) { | ||
result += '"'; | ||
} | ||
result += value.replace(/'/ug, '"'); | ||
if (needQuoting) { | ||
result += '"'; | ||
} | ||
} | ||
} | ||
return `${result}}`; | ||
}; | ||
exports.resolveFile = (_filename, _currentFileName) => { | ||
let filename = ''; | ||
if (_filename.startsWith('../')) { | ||
const filename = _filename.replace(/\.\.\//ug, ''); | ||
return path_1.extname(filename) === '.vue' ? filename : path_1.extname(filename) !== '' ? filename : `${filename}.vue`; | ||
filename = _filename.replace(/\.\.\//ug, ''); | ||
} | ||
else if (_filename.startsWith('./')) { | ||
const filename = `${path_1.dirname(_currentFileName)}/${_filename.replace(/\.\/|/ug, '')}`; | ||
return path_1.extname(filename) === '.vue' ? filename : path_1.extname(filename) !== '' ? filename : `${filename}.vue`; | ||
filename = `${path_1.dirname(_currentFileName)}/${_filename.replace(/\.\/|/ug, '')}`; | ||
} | ||
else if (_filename.startsWith('~') || _filename.startsWith('@')) { | ||
const filename = _filename.replace('~', '.').replace('@', '.'); | ||
return path_1.extname(filename) === '.vue' ? filename : path_1.extname(filename) !== '' ? filename : `${filename}.vue`; | ||
filename = _filename.replace('~', '.').replace('@', '.'); | ||
} | ||
return ''; | ||
if (filename) { | ||
if (path_1.extname(filename) === '') { | ||
return `${filename}.vue`; | ||
} | ||
} | ||
return filename; | ||
}; | ||
@@ -37,2 +76,3 @@ exports.getImportDeclarationTree = (fileName) => { | ||
name: filename.replace(cwd, ''), | ||
props: '', | ||
children, | ||
@@ -51,2 +91,8 @@ }; | ||
const esLintProgram = vue_eslint_parser_1.parse(file, parserOption); | ||
if (esLintProgram.tokens) { | ||
const propsDeclaration = JSON.parse(exports.getPropsDeclaration(esLintProgram.tokens)); | ||
if (propsDeclaration && propsDeclaration.props) { | ||
result.props = propsDeclaration.props; | ||
} | ||
} | ||
const body = exports.getImportDeclaration(esLintProgram.body); | ||
@@ -53,0 +99,0 @@ for (let i = 0, len = body.length; i < len; i++) { |
{ | ||
"name": "@tkskto/vue-component-analyzer", | ||
"version": "0.0.6", | ||
"version": "0.1.0", | ||
"description": "Analyze dependency tree for Vue.js SFC (Single File Component)", | ||
@@ -65,3 +65,3 @@ "main": "dist/index.js", | ||
"nyc": "15.1.0", | ||
"rollup": "2.28.2", | ||
"rollup": "2.29.0", | ||
"rollup-plugin-license": "2.2.0", | ||
@@ -68,0 +68,0 @@ "typescript": "4.0.3" |
@@ -23,3 +23,3 @@ # vue-component-analyzer | ||
Or you can use npx: | ||
Or you can use npx(after npm install): | ||
@@ -26,0 +26,0 @@ ``` |
declare namespace vueComponentAnalyzer { | ||
interface FileReport { | ||
name: string, | ||
props: string, | ||
children: FileReport[] | ||
} | ||
export function getImportDeclarationTree(rootDir: string, file: string): FileReport; | ||
@@ -6,6 +11,2 @@ interface AnalyzeReport { | ||
} | ||
interface FileReport { | ||
name: string, | ||
children: FileReport[] | ||
} | ||
} | ||
@@ -12,0 +13,0 @@ |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
22969
509
12