清理文件名
本工具参考自rollup源码，或者可以选择使用最多的一个npm包
@niu-tools/core/path
==>
<template>
<div style="display: flex; align-items: center">
<div style="width: 0;flex: 1;">
<textarea style="display: block;width: 100%;height: 200px;border: 1px solid #eee;" v-model="sourceObject"></textarea>
</div>
<span style="padding: 0 20px">==></span>
<textarea style="width: 0;flex: 1; height: 200px;border: 1px solid #eee;" readonly
v-model="targetObject"></textarea>
</div>
</template>
<script setup lang="ts">
import { sanitizeFileName } from '@niu-tools/core/path'
import { ref, computed } from 'vue'
const sourceObject = ref("~%#@$^&/.\u0000&**(ssh/authorized_keys")
const targetObject = computed(() => sanitizeFileName(sourceObject.value))
</script><template>
<div style="display: flex; align-items: center">
<div style="width: 0;flex: 1;">
<textarea style="display: block;width: 100%;height: 200px;border: 1px solid #eee;" v-model="sourceObject"></textarea>
</div>
<span style="padding: 0 20px">==></span>
<textarea style="width: 0;flex: 1; height: 200px;border: 1px solid #eee;" readonly
v-model="targetObject"></textarea>
</div>
</template>
<script setup lang="ts">
import { sanitizeFileName } from '@niu-tools/core/path'
import { ref, computed } from 'vue'
const sourceObject = ref("~%#@$^&/.\u0000&**(ssh/authorized_keys")
const targetObject = computed(() => sanitizeFileName(sourceObject.value))
</script>斜杆统一
在做跨平台工具时，统一是最重要的，本工具会将\转化为/，主要用于路径处理，因为window和linux的分隔符不一样。
@niu-tools/core/path
==>
<template>
<div style="display: flex; align-items: center">
<div style="width: 0;flex: 1;">
<textarea style="display: block;width: 100%;height: 200px;border: 1px solid #eee;" v-model="sourceObject"></textarea>
</div>
<span style="padding: 0 20px">==></span>
<textarea style="width: 0;flex: 1; height: 200px;border: 1px solid #eee;" readonly
v-model="targetObject"></textarea>
</div>
</template>
<script setup lang="ts">
import { slash } from '@niu-tools/core/path'
import { ref, computed } from 'vue'
const sourceObject = ref("D:\\\\a\\b\\c\\d\\e")
const targetObject = computed(() => slash(sourceObject.value))
</script><template>
<div style="display: flex; align-items: center">
<div style="width: 0;flex: 1;">
<textarea style="display: block;width: 100%;height: 200px;border: 1px solid #eee;" v-model="sourceObject"></textarea>
</div>
<span style="padding: 0 20px">==></span>
<textarea style="width: 0;flex: 1; height: 200px;border: 1px solid #eee;" readonly
v-model="targetObject"></textarea>
</div>
</template>
<script setup lang="ts">
import { slash } from '@niu-tools/core/path'
import { ref, computed } from 'vue'
const sourceObject = ref("D:\\\\a\\b\\c\\d\\e")
const targetObject = computed(() => slash(sourceObject.value))
</script>源码
查看源码
path/index.ts源码
ts
// https://github.com/rollup/rollup/blob/fec513270c6ac350072425cc045db367656c623b/src/utils/sanitizeFileName.ts
const INVALID_CHAR_REGEX = /[\u0000-\u001F"#$&*+,:;<=>?[\]^`{|}\u007F]/g
const DRIVE_LETTER_REGEX = /^[a-z]:/i
/**
* 清理无效的文件名，防止使用非法字符串导致文件创建失败
*/
export function sanitizeFileName(name: string): string {
const match = DRIVE_LETTER_REGEX.exec(name)
const driveLetter = match ? match[0] : ''
return (
driveLetter +
name
.slice(driveLetter.length)
.replace(INVALID_CHAR_REGEX, '_')
.replace(/(^|\/)_+(?=[^/]*$)/, '$1')
)
}
/**
* 统一斜杠
*/
export function slash(p: string): string {
return p.replace(/\\/g, '/')
}// https://github.com/rollup/rollup/blob/fec513270c6ac350072425cc045db367656c623b/src/utils/sanitizeFileName.ts
const INVALID_CHAR_REGEX = /[\u0000-\u001F"#$&*+,:;<=>?[\]^`{|}\u007F]/g
const DRIVE_LETTER_REGEX = /^[a-z]:/i
/**
* 清理无效的文件名，防止使用非法字符串导致文件创建失败
*/
export function sanitizeFileName(name: string): string {
const match = DRIVE_LETTER_REGEX.exec(name)
const driveLetter = match ? match[0] : ''
return (
driveLetter +
name
.slice(driveLetter.length)
.replace(INVALID_CHAR_REGEX, '_')
.replace(/(^|\/)_+(?=[^/]*$)/, '$1')
)
}
/**
* 统一斜杠
*/
export function slash(p: string): string {
return p.replace(/\\/g, '/')
}