fix: use hyphenate instead of kebabCase (fixes #165)

Author: pi0

src/scan.ts

@@ -1,12 +1,17 @@
 import { basename, extname, join, dirname, relative } from 'upath'
 import globby from 'globby'
-import { kebabCase, pascalCase, splitByCase } from 'scule'
+import { pascalCase, splitByCase } from 'scule'
 import type { ScanDir, Component } from './types'
 
 export function sortDirsByPathLength ({ path: pathA }: ScanDir, { path: pathB }: ScanDir): number {
  return pathB.split(/[\\/]/).filter(Boolean).length - pathA.split(/[\\/]/).filter(Boolean).length
 }
 
+// vue@2 src/shared/util.js
+function hyphenate (str: string):string {
+ return str.replace(/\B([A-Z])/g, '-$1').toLowerCase()
+}
+
 export async function scanComponents (dirs: ScanDir[], srcDir: string): Promise<Component[]> {
  const components: Component[] = []
  const filePaths = new Set<string>()
@@ -54,7 +59,7 @@ export async function scanComponents (dirs: ScanDir[], srcDir: string): Promise<
  resolvedNames.set(componentName, filePath)
 
  const pascalName = pascalCase(componentName)
- const kebabName = kebabCase(componentName)
+ const kebabName = hyphenate(componentName)
  const shortPath = relative(srcDir, filePath)
  const chunkName = 'components/' + kebabName
 

test/fixture/components/PAScal.vue renamed to test/fixture/components/NComponent.vue

@@ -7,6 +7,6 @@
  <IconHome />
  <MAwesome />
  <Functional />
- <PAScal />
+ <NComponent />
  </div>
 </template>

test/fixture/pages/index.vue

@@ -11,7 +11,7 @@ test('scanner', async () => {
  'Bar',
  'Big',
  'Mouse',
- 'PAScal',
+ 'NComponent',
  'Foo',
  'Functional',
  'FunctionalChild',

test/unit/scanner.test.ts

@@ -4,7 +4,7 @@ import { extractTags } from '../../src/tagExtractor'
 test('with template', async () => {
  const tags = await extractTags(path.resolve('test/fixture/pages/index.vue'))
 
- expect(tags).toEqual(['Header', 'Foo', 'LazyBar', 'BaseButton', 'IconHome', 'MAwesome', 'Functional', 'PAScal', 'div'])
+ expect(tags).toEqual(['Header', 'Foo', 'LazyBar', 'BaseButton', 'IconHome', 'MAwesome', 'Functional', 'NComponent', 'div'])
 })
 
 test('without template', async () => {