mirror of
https://github.com/coreui/coreui-icons.git
synced 2025-08-09 10:16:29 +02:00
chore: update build scripts
This commit is contained in:
66
build/build-examples.js
Normal file
66
build/build-examples.js
Normal file
@@ -0,0 +1,66 @@
|
|||||||
|
const fs = require('fs')
|
||||||
|
const mkdirp = require('mkdirp')
|
||||||
|
const path = require('path')
|
||||||
|
const rimraf = require('rimraf')
|
||||||
|
const walkSync = require('./walk-sync.js')
|
||||||
|
|
||||||
|
const dataDir = path.join(__dirname, '../data')
|
||||||
|
const examplesDir = path.join(__dirname, '../examples')
|
||||||
|
|
||||||
|
const prefixes = {
|
||||||
|
brand: 'cib-',
|
||||||
|
duotone: 'cid-',
|
||||||
|
flag: 'cif-',
|
||||||
|
free: 'cil-',
|
||||||
|
linear: 'cil-',
|
||||||
|
solid: 'cis-'
|
||||||
|
}
|
||||||
|
|
||||||
|
const unique = (array, key) => array.map(e => e[key]).map((e, i, final) => final.indexOf(e) === i && i).filter(e => array[e]).map(e => array[e])
|
||||||
|
|
||||||
|
const main = () => {
|
||||||
|
rimraf.sync(examplesDir)
|
||||||
|
mkdirp(examplesDir, (err) => {
|
||||||
|
if (err) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
const files = walkSync(dataDir).filter(element => path.extname(element) === '.json')
|
||||||
|
files.forEach(file => {
|
||||||
|
const rawdata = fs.readFileSync(file)
|
||||||
|
const icons = JSON.parse(rawdata).icons.sort((a,b) => (a.name > b.name) ? 1 : ((b.name > a.name) ? -1 : 0))
|
||||||
|
|
||||||
|
const type = path.basename(file).replace('.json', '')
|
||||||
|
const prefix = prefixes[type.toLowerCase()]
|
||||||
|
|
||||||
|
let html = `<!DOCTYPE html>\n<html lang="en">\n<head>\n <meta charset="UTF-8">\n`
|
||||||
|
html += ` <title>CoreUI Icons - ${type}</title>\n`
|
||||||
|
html += ` <link rel="stylesheet" type="text/css" href="https://unpkg.com/@coreui/coreui@3.0.0/dist/css/coreui.min.css">\n`
|
||||||
|
html += ` <link rel="stylesheet" type="text/css" href="../css/${type.toLowerCase()}.min.css">\n`
|
||||||
|
html += `</head>\n<body>\n`
|
||||||
|
|
||||||
|
html += ` <div class="row">\n`
|
||||||
|
unique(icons, 'name').forEach(icon => {
|
||||||
|
const name = icon.name
|
||||||
|
html += ` <div class="col-1 py-4 text-center"><i class="c-icon c-icon-2xl ${prefix}${name.toLowerCase()}"></i></div>\n`
|
||||||
|
})
|
||||||
|
html += ` </div>\n<hr>\n`
|
||||||
|
html += ` <div class="row">\n`
|
||||||
|
unique(icons, 'name').forEach(icon => {
|
||||||
|
const name = icon.name
|
||||||
|
html += ` <div class="col-1 py-4 text-center"><svg class="c-icon c-icon-2xl"><use xlink:href="../sprites/${type.toLowerCase()}.svg#${prefix}${name.toLowerCase()}"></use></svg></div>\n`
|
||||||
|
})
|
||||||
|
html += ` </div>\n<hr>\n`
|
||||||
|
html += ` <div class="row">\n`
|
||||||
|
unique(icons, 'name').forEach(icon => {
|
||||||
|
const name = icon.name
|
||||||
|
html += ` <div class="col-1 py-4 text-center"><object class="c-icon c-icon-2xl" type="image/svg+xml" data="../svg/${type.toLowerCase()}/${prefix}${name.toLowerCase()}.svg">Your browser does not support SVGs</object></div>\n`
|
||||||
|
})
|
||||||
|
html += ` </div>\n`
|
||||||
|
html += `</body>\n</html>`
|
||||||
|
|
||||||
|
fs.writeFileSync(path.join(examplesDir, path.basename(file).replace('.json', '.html')), html)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
main()
|
88
build/build-fonts.js
Normal file
88
build/build-fonts.js
Normal file
@@ -0,0 +1,88 @@
|
|||||||
|
const fs = require('fs')
|
||||||
|
const mkdirp = require('mkdirp');
|
||||||
|
const path = require('path')
|
||||||
|
const webfont = require('webfont').default
|
||||||
|
|
||||||
|
const argv = require('minimist')(process.argv.slice(2), {
|
||||||
|
string: ['src', 'name', 'prefix']
|
||||||
|
})
|
||||||
|
|
||||||
|
const dataDir = path.join(__dirname, '../data')
|
||||||
|
const fontDir = path.join(__dirname, '../fonts')
|
||||||
|
const svgDir = path.join(__dirname, '../svg', argv.src.toLowerCase())
|
||||||
|
|
||||||
|
webfont({
|
||||||
|
files: `${svgDir}/**/*.svg`,
|
||||||
|
fontName: argv.name,
|
||||||
|
fontHeight: 5000,
|
||||||
|
startUnicode: 'ec0f',
|
||||||
|
verbose: true,
|
||||||
|
}).then(result => {
|
||||||
|
|
||||||
|
mkdirp(fontDir, (err) => {
|
||||||
|
if (err) throw err
|
||||||
|
|
||||||
|
fs.writeFile(`${path.join(fontDir, argv.name)}.eot`, result.eot, (err) => {
|
||||||
|
if (err) throw err
|
||||||
|
console.log(`The ${path.join(fontDir, argv.name)}.eot file has been saved!`)
|
||||||
|
})
|
||||||
|
|
||||||
|
fs.writeFile(`${path.join(fontDir, argv.name)}.svg`, result.svg, (err) => {
|
||||||
|
if (err) throw err
|
||||||
|
console.log(`The ${path.join(fontDir, argv.name)}.eot file has been saved!`)
|
||||||
|
})
|
||||||
|
|
||||||
|
fs.writeFile(`${path.join(fontDir, argv.name)}.ttf`, result.ttf, (err) => {
|
||||||
|
if (err) throw err
|
||||||
|
console.log(`The ${path.join(fontDir, argv.name)}.eot file has been saved!`)
|
||||||
|
})
|
||||||
|
|
||||||
|
fs.writeFile(`${path.join(fontDir, argv.name)}.woff`, result.woff, (err) => {
|
||||||
|
if (err) throw err
|
||||||
|
console.log(`The ${path.join(fontDir, argv.name)}.eot file has been saved!`)
|
||||||
|
})
|
||||||
|
|
||||||
|
fs.writeFile(`${path.join(fontDir, argv.name)}.woff2`, result.woff2, (err) => {
|
||||||
|
if (err) throw err
|
||||||
|
console.log(`The ${path.join(fontDir, argv.name)}.eot file has been saved!`)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
const iconsList = []
|
||||||
|
|
||||||
|
result.glyphsData.forEach(element => {
|
||||||
|
const name = element.metadata.name
|
||||||
|
const unicode = element.metadata.unicode
|
||||||
|
|
||||||
|
iconsList.push({
|
||||||
|
name: name.replace(`${argv.prefix}-`,''),
|
||||||
|
unicode: `\\${unicode[0].codePointAt(0).toString(16)}`
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
// Add unicodes to icons lists
|
||||||
|
fs.readFile(`${dataDir}/${argv.name.replace('CoreUI-Icons-', '')}.json`, 'utf8', function readFileCallback(err, data){
|
||||||
|
if (err) throw err
|
||||||
|
obj = JSON.parse(data)
|
||||||
|
|
||||||
|
const mergeByName = (a1, a2) =>
|
||||||
|
a1.map(itm => ({
|
||||||
|
...a2.find((item) => (item.name === itm.name) && item),
|
||||||
|
...itm
|
||||||
|
}))
|
||||||
|
|
||||||
|
json = JSON.stringify({
|
||||||
|
"icons": mergeByName(obj.icons, iconsList)
|
||||||
|
}, null, 2)
|
||||||
|
|
||||||
|
fs.writeFileSync(`${dataDir}/${argv.name.replace('CoreUI-Icons-', '')}.json`, json)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
.catch(error => {
|
||||||
|
throw error
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
// formats: [ 'svg', 'ttf', 'eot', 'woff', 'woff2' ]
|
||||||
|
// Bufer ttf, eot, woff
|
76
build/build-icons-lists.js
Normal file
76
build/build-icons-lists.js
Normal file
@@ -0,0 +1,76 @@
|
|||||||
|
const fs = require('fs')
|
||||||
|
const mkdirp = require('mkdirp')
|
||||||
|
const path = require('path')
|
||||||
|
const walkSync = require('./walk-sync.js')
|
||||||
|
|
||||||
|
const dataDir = path.join(__dirname, '../data')
|
||||||
|
const rawDir = path.join(__dirname, '../raw')
|
||||||
|
|
||||||
|
const prefixes = {
|
||||||
|
brand: 'cib-',
|
||||||
|
duotone: 'cid-',
|
||||||
|
flag: 'cif-',
|
||||||
|
free: 'cil-',
|
||||||
|
linear: 'cil-',
|
||||||
|
solid: 'cis-'
|
||||||
|
}
|
||||||
|
|
||||||
|
const main = () => {
|
||||||
|
const types = fs.readdirSync(rawDir).filter(element => fs.statSync(path.join(rawDir, element)).isDirectory())
|
||||||
|
const allIconsList = {
|
||||||
|
icons: []
|
||||||
|
}
|
||||||
|
|
||||||
|
types.forEach(type => {
|
||||||
|
const icons = walkSync(path.join(rawDir, type)).filter(element => path.extname(element) === '.svg').map(element => path.relative(path.join(rawDir, type), element).replace('SVG/', ''))
|
||||||
|
const iconsList = {
|
||||||
|
icons: []
|
||||||
|
}
|
||||||
|
icons.forEach(icon => {
|
||||||
|
const category = icon.split('/').length > 1 ? icon.split('/')[0] : type
|
||||||
|
const filename = icon.split('/').length > 1 ? icon.split('/')[1] : icon.split('/')[0]
|
||||||
|
const prefix = prefixes[type.toLowerCase()]
|
||||||
|
|
||||||
|
if (filename.indexOf(',') !== -1) {
|
||||||
|
throw `${type} - ${category} - ${filename}`
|
||||||
|
}
|
||||||
|
|
||||||
|
if (filename.indexOf('#') !== -1) {
|
||||||
|
filename.split('#').forEach(element => {
|
||||||
|
let iconDetails = {
|
||||||
|
name: element.replace('.svg', ''),
|
||||||
|
category,
|
||||||
|
type,
|
||||||
|
prefix
|
||||||
|
}
|
||||||
|
iconsList.icons.push(iconDetails)
|
||||||
|
allIconsList.icons.push(iconDetails)
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
let iconDetails = {
|
||||||
|
name: filename.replace('.svg', ''),
|
||||||
|
category,
|
||||||
|
type,
|
||||||
|
prefix
|
||||||
|
}
|
||||||
|
iconsList.icons.push(iconDetails)
|
||||||
|
allIconsList.icons.push(iconDetails)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
let data = JSON.stringify(iconsList, null, 2)
|
||||||
|
|
||||||
|
mkdirp(dataDir, (err) => {
|
||||||
|
if (err) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
fs.writeFileSync(path.join(dataDir, `${type}.json`), data)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
let data = JSON.stringify(allIconsList, null, 2)
|
||||||
|
fs.writeFileSync(path.join(dataDir, 'All.json'), data)
|
||||||
|
}
|
||||||
|
|
||||||
|
main()
|
@@ -1,7 +1,10 @@
|
|||||||
const fs = require('fs')
|
const fs = require('fs')
|
||||||
const mkdirp = require('mkdirp');
|
const mkdirp = require('mkdirp')
|
||||||
|
const path = require('path')
|
||||||
|
const { extname } = path
|
||||||
|
|
||||||
const dirnames = process.mainModule.filename.includes('pro') ?
|
const dirnames = process.mainModule.filename.includes('pro') ?
|
||||||
['solid', 'linear']
|
['solid', 'linear', 'duotone', 'brand', 'flag']
|
||||||
: ['free', 'brand', 'flag']
|
: ['free', 'brand', 'flag']
|
||||||
|
|
||||||
let allNames = {}
|
let allNames = {}
|
||||||
@@ -18,96 +21,96 @@ dirnames.forEach(setName => {
|
|||||||
let contents = {}
|
let contents = {}
|
||||||
let names = []
|
let names = []
|
||||||
filenames.forEach(filename => {
|
filenames.forEach(filename => {
|
||||||
fs.readFile(dirname + filename, 'utf-8', function (e, content) {
|
console.log(filename)
|
||||||
if (e) {
|
if (extname(filename) === '.svg') {
|
||||||
return
|
fs.readFile(dirname + filename, 'utf-8', function (e, content) {
|
||||||
}
|
if (e) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
const variableName = toCamel(filename.replace('.svg', ''))
|
const variableName = toCamel(filename.replace('.svg', ''))
|
||||||
const jsFilename = filename.replace('.svg', '.js')
|
const jsFilename = filename.replace('.svg', '.js')
|
||||||
const tsFilename = filename.replace('.svg', '.d.ts')
|
const tsFilename = filename.replace('.svg', '.d.ts')
|
||||||
const viewBox = getAttributeValue(content, 'viewBox').split(' ')
|
const viewBox = getAttributeValue(content, 'viewBox').split(' ')
|
||||||
const dimensions = `${viewBox[2]} ${viewBox[3]}`
|
const dimensions = `${viewBox[2]} ${viewBox[3]}`
|
||||||
|
|
||||||
let iconData = []
|
let iconData = []
|
||||||
if (dimensions !== '64 64') {
|
if (dimensions !== '64 64') {
|
||||||
iconData.push(dimensions)
|
iconData.push(dimensions)
|
||||||
}
|
}
|
||||||
const computedContent = content.replace(/(<svg([^>]+)>)|(<\/svg>)/ig, '')
|
const computedContent =
|
||||||
.replace(/(<title([^]+)title>)/ig, '')
|
content
|
||||||
.replace(/\n/g, '').replace(/\r/g, '').replace(/"/g, '\'')
|
.replace(/(<svg([^>]+)>)|(<\/svg>)/ig, '')
|
||||||
.replace('<!-- Generated by IcoMoon.io -->', '')
|
.replace(/\n\s\s+/g, '')
|
||||||
iconData.push(computedContent)
|
.replace(/\n/g, '')
|
||||||
|
.replace(/"/g, '\'')
|
||||||
|
.replace('<!-- Generated by IcoMoon.io -->', '')
|
||||||
|
iconData.push(computedContent)
|
||||||
|
|
||||||
contents[variableName] = iconData
|
contents[variableName] = iconData
|
||||||
|
|
||||||
names.push({
|
// variableName = validate(variableName)
|
||||||
jsFilename,
|
// jsFilename = validate(jsFilename)
|
||||||
variableName
|
importName = validate(variableName)
|
||||||
|
|
||||||
|
names.push({
|
||||||
|
jsFilename,
|
||||||
|
variableName,
|
||||||
|
importName
|
||||||
|
})
|
||||||
|
|
||||||
|
fs.writeFile(
|
||||||
|
`js/${setName}/${jsFilename}`,
|
||||||
|
`export const ${importName} = ` + JSON.stringify(iconData),
|
||||||
|
() => ''
|
||||||
|
)
|
||||||
|
fs.writeFile(
|
||||||
|
`js/${setName}/${tsFilename}`,
|
||||||
|
`export declare const ${importName}: any[];`,
|
||||||
|
() => ''
|
||||||
|
)
|
||||||
})
|
})
|
||||||
if (Object.keys(contents).length === filenames.length) {
|
}
|
||||||
writeSet(setName, contents, names)
|
|
||||||
}
|
|
||||||
|
|
||||||
fs.writeFile(
|
|
||||||
`js/${setName}/${jsFilename}`,
|
|
||||||
`export const ${variableName} = ` + JSON.stringify(iconData),
|
|
||||||
() => ''
|
|
||||||
)
|
|
||||||
fs.writeFile(
|
|
||||||
`js/${setName}/${tsFilename}`,
|
|
||||||
`export declare const ${variableName}: string[];`,
|
|
||||||
() => ''
|
|
||||||
)
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
setTimeout(() => {
|
||||||
|
fs.writeFile(
|
||||||
|
`js/${setName}/${setName}-set.js`,
|
||||||
|
`export const ${setName}Set = ` + JSON.stringify(contents),
|
||||||
|
() => ''
|
||||||
|
)
|
||||||
|
fs.writeFile(
|
||||||
|
`js/${setName}/${setName}-set.d.ts`,
|
||||||
|
typings(names, setName, false),
|
||||||
|
() => ''
|
||||||
|
)
|
||||||
|
fs.writeFile(
|
||||||
|
`js/${setName}/index.js`,
|
||||||
|
getImports(names, setName),
|
||||||
|
() => ''
|
||||||
|
)
|
||||||
|
fs.writeFile(
|
||||||
|
`js/${setName}/index.d.ts`,
|
||||||
|
typings(names, setName),
|
||||||
|
() => ''
|
||||||
|
)
|
||||||
|
allNames[setName] = names
|
||||||
|
}, 1000)
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
const writeSet = (setName, contents, names) => {
|
setTimeout(() => {
|
||||||
|
let imports = ''
|
||||||
|
Object.keys(allNames).forEach(set => {
|
||||||
|
imports += getImports(allNames[set], set, true)
|
||||||
|
imports += '\n\n\n'
|
||||||
|
})
|
||||||
fs.writeFile(
|
fs.writeFile(
|
||||||
`js/${setName}/${setName}-set.js`,
|
`index.js`,
|
||||||
`export const ${setName}Set = ` + JSON.stringify(contents),
|
imports,
|
||||||
() => console.log(
|
|
||||||
'created set: ' +
|
|
||||||
setName +
|
|
||||||
' icons number: ' +
|
|
||||||
Object.keys(contents).length
|
|
||||||
)
|
|
||||||
)
|
|
||||||
fs.writeFile(
|
|
||||||
`js/${setName}/${setName}-set.d.ts`,
|
|
||||||
typings(names, setName, false),
|
|
||||||
() => ''
|
() => ''
|
||||||
)
|
)
|
||||||
fs.writeFile(
|
}, 3000)
|
||||||
`js/${setName}/index.js`,
|
|
||||||
getImports(names, setName),
|
|
||||||
() => ''
|
|
||||||
)
|
|
||||||
fs.writeFile(
|
|
||||||
`js/${setName}/index.d.ts`,
|
|
||||||
typings(names, setName),
|
|
||||||
() => ''
|
|
||||||
)
|
|
||||||
allNames[setName] = names
|
|
||||||
|
|
||||||
if (Object.keys(allNames).length === dirnames.length) {
|
|
||||||
let imports = ''
|
|
||||||
Object.keys(allNames).forEach(set => {
|
|
||||||
imports += getImports(allNames[set], set, true)
|
|
||||||
imports += '\n\n\n'
|
|
||||||
})
|
|
||||||
fs.writeFile(
|
|
||||||
`js/index.js`,
|
|
||||||
imports,
|
|
||||||
() => console.log('created index file')
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// const toPascalCase = function (name) {
|
// const toPascalCase = function (name) {
|
||||||
@@ -139,35 +142,36 @@ function toCamel (str) {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
// function validate(str) {
|
function validate(str) {
|
||||||
// if (!isNaN(str.charAt(0))) {
|
if (!isNaN(str.charAt(0))) {
|
||||||
// return 'n' + str
|
return 'n' + str
|
||||||
// } else {
|
} else {
|
||||||
// return str
|
return str
|
||||||
// }
|
}
|
||||||
// }
|
}
|
||||||
|
|
||||||
function getImports(names, setName, deep = false) {
|
function getImports(names, setName, deep = false) {
|
||||||
const folder = deep ? `/${setName}/` : '/'
|
const folder = deep ? `/js/${setName}/` : '/'
|
||||||
const defaultImport = `import { ${setName}Set } from '.${folder}${setName}-set.js' \n`
|
const defaultImport = `import { ${setName}Set } from '.${folder}${setName}-set.js' \n`
|
||||||
const defaultExport = `export { ${setName}Set } \n\n`
|
const defaultExport = `export { ${setName}Set } \n\n`
|
||||||
const importString = names.map(name => {
|
const importString = names.map(name => {
|
||||||
return `import { ${name.variableName} } from '.${folder}${name.jsFilename}'`
|
return `import { ${name.importName} } from '.${folder}${name.jsFilename}'`
|
||||||
}).join('\n')
|
}).join('\n')
|
||||||
const exportString = names.map(name => {
|
const exportString = names.map(name => {
|
||||||
return `export { ${name.variableName} }`
|
return `export { ${name.importName} }`
|
||||||
}).join('\n')
|
}).join('\n')
|
||||||
return defaultImport + defaultExport + importString + '\n' + exportString
|
return defaultImport + defaultExport + importString + '\n' + exportString
|
||||||
}
|
}
|
||||||
|
|
||||||
function typings (names, setName, all = true) {
|
function typings(names, setName, all = true) {
|
||||||
|
|
||||||
const icons = names.map(name => {
|
const icons = names.map(name => {
|
||||||
return ` "${name.variableName}": string[];`
|
return ` "${name.importName}": any[];`
|
||||||
}).join('\n')
|
}).join('\n')
|
||||||
const set = `export declare const ${setName}Set: {\n${icons}\n}`
|
const set = `export declare const ${setName}Set: {\n${icons}\n}`
|
||||||
|
|
||||||
const exportString = names.map(name => {
|
const exportString = names.map(name => {
|
||||||
return `export declare const ${name.variableName}: string[];`
|
return `export declare const ${name.importName}: any[];`
|
||||||
}).join('\n')
|
}).join('\n')
|
||||||
|
|
||||||
return all ? set + '\n' + exportString : set
|
return all ? set + '\n' + exportString : set
|
||||||
|
@@ -2,11 +2,16 @@ const sharp = require('sharp')
|
|||||||
const fs = require('fs')
|
const fs = require('fs')
|
||||||
const mkdirp = require('mkdirp');
|
const mkdirp = require('mkdirp');
|
||||||
const dirnames = process.mainModule.filename.includes('pro') ?
|
const dirnames = process.mainModule.filename.includes('pro') ?
|
||||||
['solid', 'linear']
|
['solid', 'linear', 'duotone', 'brand', 'flag']
|
||||||
: ['free', 'brand', 'flag']
|
: ['free', 'brand', 'flag']
|
||||||
const dest = 'png/'
|
const dest = 'png/'
|
||||||
const sizes = [16, 32, 64, 128, 256]
|
let sizes
|
||||||
|
|
||||||
|
const argv = require('minimist')(process.argv.slice(2), {
|
||||||
|
array: ['sizes']
|
||||||
|
})
|
||||||
|
|
||||||
|
argv.sizes ? sizes = argv.sizes : sizes = [16, 32, 64]
|
||||||
|
|
||||||
dirnames.forEach(setName => {
|
dirnames.forEach(setName => {
|
||||||
const dirname = `svg/${setName}/`
|
const dirname = `svg/${setName}/`
|
@@ -1,15 +1,17 @@
|
|||||||
const fs = require('fs')
|
const fs = require('fs')
|
||||||
const mkdirp = require('mkdirp');
|
const mkdirp = require('mkdirp');
|
||||||
|
const path = require('path')
|
||||||
const dirnames = process.mainModule.filename.includes('pro') ?
|
const dirnames = process.mainModule.filename.includes('pro') ?
|
||||||
['solid', 'linear']
|
['solid', 'linear', 'duotone', 'brand', 'flag']
|
||||||
: ['free', 'brand', 'flag']
|
: ['free', 'brand', 'flag']
|
||||||
|
|
||||||
const prefixes = {
|
const prefixes = {
|
||||||
brand: 'cib-',
|
brand: 'cib-',
|
||||||
flag: 'cif-',
|
duotone: 'cid-',
|
||||||
free: 'cil-',
|
flag: 'cif-',
|
||||||
linear: 'cil-',
|
free: 'cil-',
|
||||||
solid: 'cis-'
|
linear: 'cil-',
|
||||||
|
solid: 'cis-'
|
||||||
}
|
}
|
||||||
|
|
||||||
const getAttributeValue = (string, attribute) => {
|
const getAttributeValue = (string, attribute) => {
|
||||||
@@ -26,25 +28,26 @@ mkdirp('sprites/', function(err) {
|
|||||||
|
|
||||||
dirnames.forEach(setName => {
|
dirnames.forEach(setName => {
|
||||||
const dirname = `svg/${setName}/`
|
const dirname = `svg/${setName}/`
|
||||||
const svgs = fs.readdirSync(dirname)
|
const svgs = fs.readdirSync(dirname).filter(element => path.extname(element) === '.svg')
|
||||||
let symbols = []
|
let symbols = []
|
||||||
svgs.forEach((svg, idx, svgs) => {
|
svgs.forEach((svg, idx, svgs) => {
|
||||||
let symbol = {}
|
let symbol = {}
|
||||||
const file = dirname + svg
|
const file = dirname + svg
|
||||||
const content = fs.readFileSync(file, 'utf8')
|
const content = fs.readFileSync(file, 'utf8')
|
||||||
const viewBox = getAttributeValue(content, 'viewBox')
|
const viewBox = getAttributeValue(content, 'viewBox')
|
||||||
const computedContent = content.replace(/(<svg([^>]+)>)|(<\/svg>)/ig, '')
|
const computedContent =
|
||||||
.replace(/\n/g, '').replace(/"/g, '\'')
|
content
|
||||||
.replace('<!-- Generated by IcoMoon.io -->', '')
|
.replace(/(<svg([^>]+)>)|(<\/svg>)/ig, '')
|
||||||
symbol = `<symbol id="${svg.replace('.svg', '').toLowerCase()}" viewBox="${viewBox}">\n${computedContent}\n</symbol>`
|
.replace(/\n\s\s+/g, '')
|
||||||
|
.replace(/\n/g, '')
|
||||||
|
.replace('<!-- Generated by IcoMoon.io -->', '')
|
||||||
|
symbol = ` <symbol id="${svg.replace('.svg', '').toLowerCase()}" viewBox="${viewBox}">\n ${computedContent}\n </symbol>`
|
||||||
idx === svgs.length - 1 ? symbols.push(symbol) : symbols.push(`${symbol}\n`)
|
idx === svgs.length - 1 ? symbols.push(symbol) : symbols.push(`${symbol}\n`)
|
||||||
})
|
})
|
||||||
fs.writeFile(
|
fs.writeFile(
|
||||||
`sprites/${setName}.svg`,
|
`sprites/${setName}.svg`,
|
||||||
`<svg aria-hidden="true" style="position: absolute; width: 0; height: 0; overflow: hidden;" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
`<svg aria-hidden="true" style="position: absolute; width: 0; height: 0; overflow: hidden;" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||||
<defs>
|
|
||||||
${symbols.join('')}
|
${symbols.join('')}
|
||||||
</defs>
|
|
||||||
</svg>`,
|
</svg>`,
|
||||||
() => ''
|
() => ''
|
||||||
)
|
)
|
||||||
|
46
build/build-variables.js
Normal file
46
build/build-variables.js
Normal file
@@ -0,0 +1,46 @@
|
|||||||
|
const fs = require('fs')
|
||||||
|
const path = require('path')
|
||||||
|
|
||||||
|
const argv = require('minimist')(process.argv.slice(2), {
|
||||||
|
string: ['type', 'prefix'],
|
||||||
|
boolean: ['font']
|
||||||
|
})
|
||||||
|
|
||||||
|
const dataDir = path.join(__dirname, '../data')
|
||||||
|
const scssDir = path.join(__dirname, '../scss', argv.type.toLowerCase())
|
||||||
|
|
||||||
|
const json = path.join(dataDir, `${argv.type}.json`)
|
||||||
|
|
||||||
|
const unique = (array, key) => array.map(e => e[key]).map((e, i, final) => final.indexOf(e) === i && i).filter(e => array[e]).map(e => array[e])
|
||||||
|
|
||||||
|
const main = () => {
|
||||||
|
const rawdata = fs.readFileSync(json)
|
||||||
|
const icons = JSON.parse(rawdata).icons.sort((a,b) => (a.name > b.name) ? 1 : ((b.name > a.name) ? -1 : 0))
|
||||||
|
let content = `$coreui-icons-prefix: "${argv.prefix}-" !default;\n`
|
||||||
|
|
||||||
|
if (argv.font) {
|
||||||
|
content += `$coreui-icons-font-path: "../fonts" !default;\n`
|
||||||
|
}
|
||||||
|
|
||||||
|
content += `\n$icons: (\n`
|
||||||
|
|
||||||
|
unique(icons, 'name').forEach(icon => {
|
||||||
|
const name = icon.name
|
||||||
|
const unicode = icon.unicode
|
||||||
|
|
||||||
|
if (unicode) {
|
||||||
|
content += ` "${name}": ${unicode},\n`
|
||||||
|
} else {
|
||||||
|
content += ` "${name}",\n`
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
content += ') !default;'
|
||||||
|
|
||||||
|
fs.writeFile(path.join(scssDir, '_variables.scss'), content, (err) => {
|
||||||
|
if (err) throw err
|
||||||
|
console.log('The _variables.scss file has been saved!')
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
main()
|
@@ -1,35 +0,0 @@
|
|||||||
const fs = require('fs')
|
|
||||||
const dirnames = process.mainModule.filename.includes('pro') ?
|
|
||||||
['solid', 'linear'] :
|
|
||||||
['flag', 'brand', 'free']
|
|
||||||
|
|
||||||
const prefixes = {
|
|
||||||
brand: 'cib-',
|
|
||||||
flag: 'cif-',
|
|
||||||
free: 'cil-',
|
|
||||||
linear: 'cil-',
|
|
||||||
solid: 'cis-'
|
|
||||||
}
|
|
||||||
console.log(dirnames)
|
|
||||||
dirnames.forEach(name => {
|
|
||||||
const dirname = `svg/${name}/`
|
|
||||||
fs.readdir(dirname, (e, filenames) => {
|
|
||||||
if (e) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
filenames.forEach(filename => {
|
|
||||||
fs.readFile(dirname + filename, 'utf-8', function (e, content) {
|
|
||||||
if (e) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
fs.writeFile(
|
|
||||||
`svg/${name}/${prefixes[name]}${filename.toLowerCase()}`,
|
|
||||||
content,
|
|
||||||
() => fs.unlink(`svg/${name}/${filename}`, () => '')
|
|
||||||
)
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
|
|
42
build/copy-svg-files.js
Normal file
42
build/copy-svg-files.js
Normal file
@@ -0,0 +1,42 @@
|
|||||||
|
const fs = require('fs')
|
||||||
|
const mkdirp = require('mkdirp')
|
||||||
|
const path = require('path')
|
||||||
|
const rimraf = require('rimraf')
|
||||||
|
const { basename } = path
|
||||||
|
const walkSync = require('./walk-sync.js')
|
||||||
|
|
||||||
|
const argv = require('minimist')(process.argv.slice(2), {
|
||||||
|
string: ['src', 'prefix']
|
||||||
|
})
|
||||||
|
|
||||||
|
const rawDir = path.join(__dirname, '../raw', argv.src)
|
||||||
|
const svgDir = path.join(__dirname, '../svg', argv.src.toLowerCase())
|
||||||
|
|
||||||
|
const main = () => {
|
||||||
|
rimraf.sync(svgDir)
|
||||||
|
mkdirp(svgDir, (err) => {
|
||||||
|
if (err) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const files = walkSync(rawDir).filter(element => path.extname(element) === '.svg')
|
||||||
|
files.forEach(file => {
|
||||||
|
if (basename(file).indexOf('#') !== -1) {
|
||||||
|
const arrayOfFiles = basename(file).replace('.svg', '').split('#')
|
||||||
|
arrayOfFiles.forEach(singleFile => {
|
||||||
|
fs.copyFile(file, path.join(svgDir, `${argv.prefix}-${singleFile}.svg`), (err) => {
|
||||||
|
if (err) throw err
|
||||||
|
console.log(`${basename(file)} was copied ${svgDir}`)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
fs.copyFile(file, path.join(svgDir, `${argv.prefix}-${basename(file)}`), (err) => {
|
||||||
|
if (err) throw err
|
||||||
|
console.log(`${basename(file)} was copied ${svgDir}`)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
main()
|
55
build/svgo.yml
Normal file
55
build/svgo.yml
Normal file
@@ -0,0 +1,55 @@
|
|||||||
|
# https://github.com/svg/svgo/blob/master/docs/how-it-works/en.md
|
||||||
|
# replace default config
|
||||||
|
|
||||||
|
multipass: true
|
||||||
|
#full: true
|
||||||
|
|
||||||
|
# https://github.com/svg/svgo/blob/master/lib/svgo/js2svg.js#L6 for more config options
|
||||||
|
|
||||||
|
js2svg:
|
||||||
|
pretty: true
|
||||||
|
indent: 2
|
||||||
|
|
||||||
|
plugins:
|
||||||
|
- cleanupAttrs: true
|
||||||
|
- cleanupEnableBackground: true
|
||||||
|
- cleanupIDs: true
|
||||||
|
- cleanupListOfValues: true
|
||||||
|
- cleanupNumericValues: true
|
||||||
|
- collapseGroups: true
|
||||||
|
- convertColors: true
|
||||||
|
- convertPathData: false
|
||||||
|
- convertShapeToPath: false
|
||||||
|
- convertStyleToAttrs: true
|
||||||
|
- convertTransform: true
|
||||||
|
- inlineStyles:
|
||||||
|
onlyMatchedOnce: false
|
||||||
|
removeMatchedSelectors: false
|
||||||
|
- mergePaths: false
|
||||||
|
- minifyStyles: true
|
||||||
|
- moveElemsAttrsToGroup: true
|
||||||
|
- moveGroupAttrsToElems: true
|
||||||
|
- removeAttrs:
|
||||||
|
attrs:
|
||||||
|
- "data-name"
|
||||||
|
- removeComments: true
|
||||||
|
- removeDesc: true
|
||||||
|
- removeDoctype: true
|
||||||
|
- removeEditorsNSData: true
|
||||||
|
- removeEmptyAttrs: true
|
||||||
|
- removeEmptyContainers: true
|
||||||
|
- removeEmptyText: true
|
||||||
|
- removeHiddenElems: true
|
||||||
|
- removeMetadata: true
|
||||||
|
- removeNonInheritableGroupAttrs: true
|
||||||
|
- removeStyleElement: true
|
||||||
|
- removeTitle: true
|
||||||
|
- removeUnknownsAndDefaults:
|
||||||
|
keepRoleAttr: true
|
||||||
|
- removeUnusedNS: true
|
||||||
|
- removeUselessDefs: true
|
||||||
|
- removeUselessStrokeAndFill: true
|
||||||
|
- removeViewBox: false
|
||||||
|
- removeXMLNS: false
|
||||||
|
- removeXMLProcInst: true
|
||||||
|
- sortAttrs: true
|
14
build/walk-sync.js
Normal file
14
build/walk-sync.js
Normal file
@@ -0,0 +1,14 @@
|
|||||||
|
'use strict'
|
||||||
|
|
||||||
|
const fs = require('fs')
|
||||||
|
const path = require('path')
|
||||||
|
|
||||||
|
// Get list of all files in directory
|
||||||
|
const walkSync = (dir, filelist = []) => {
|
||||||
|
fs.readdirSync(dir).forEach(file => {
|
||||||
|
filelist = fs.statSync(path.join(dir, file)).isDirectory() ? walkSync(path.join(dir, file), filelist) : filelist.concat(path.join(dir, file))
|
||||||
|
})
|
||||||
|
return filelist
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = walkSync
|
47
package.json
47
package.json
@@ -1,28 +1,42 @@
|
|||||||
{
|
{
|
||||||
"name": "@coreui/icons",
|
"name": "@coreui/icons",
|
||||||
"version": "1.0.1",
|
"version": "2.0.0-beta.0",
|
||||||
"description": "CoreUI Icons Free",
|
"description": "CoreUI Icons Free",
|
||||||
"main": "js/index.js",
|
"main": "js/index.js",
|
||||||
"style": "css/all.css",
|
"style": "css/all.css",
|
||||||
"sideEffects": false,
|
"sideEffects": false,
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"clean": "rimraf css js/{brand,flag,free} png sprites",
|
"clean": "rimraf css js/{brand,flag,free} png svg sprites",
|
||||||
|
"copy": "npm-run-all --parallel copy-*",
|
||||||
|
"copy-brand": "node build/copy-svg-files.js --src brand --prefix cib",
|
||||||
|
"copy-flag": "node build/copy-svg-files.js --src flag --prefix cif",
|
||||||
|
"copy-free": "node build/copy-svg-files.js --src free --prefix cil",
|
||||||
|
"optimize": "svgo -r svg/ --config=build/svgo.yml",
|
||||||
|
"icons-list": "node build/build-icons-lists.js",
|
||||||
|
"fonts": "npm-run-all --parallel font-*",
|
||||||
|
"font-brand": "node build/build-fonts.js --src brand --name CoreUI-Icons-Brand --prefix cib",
|
||||||
|
"font-free": "node build/build-fonts.js --src free --name CoreUI-Icons-Free --prefix cil",
|
||||||
|
"scss-variables": "npm-run-all --parallel scss-variables-*",
|
||||||
|
"scss-variables-brand": "node build/build-variables.js --type Brand --prefix cib --font true",
|
||||||
|
"scss-variables-flag": "node build/build-variables.js --type Flag --prefix cif",
|
||||||
|
"scss-variables-free": "node build/build-variables.js --type Free --prefix cil --font true",
|
||||||
"css": "npm-run-all --parallel css-compile* --sequential css-prefix css-concat css-minify*",
|
"css": "npm-run-all --parallel css-compile* --sequential css-prefix css-concat css-minify*",
|
||||||
"css-compile-free": "node-sass --output-style expanded --source-map true --source-map-contents true --precision 6 scss/free/free-icons.scss css/free.css",
|
|
||||||
"css-compile-brand": "node-sass --output-style expanded --source-map true --source-map-contents true --precision 6 scss/brand/brand-icons.scss css/brand.css",
|
"css-compile-brand": "node-sass --output-style expanded --source-map true --source-map-contents true --precision 6 scss/brand/brand-icons.scss css/brand.css",
|
||||||
"css-compile-flag": "node-sass --output-style expanded --source-map true --source-map-contents true --precision 6 scss/flag/flag-icons.scss css/flag.css",
|
"css-compile-flag": "node-sass --output-style expanded --source-map true --source-map-contents true --precision 6 scss/flag/flag-icons.scss css/flag.css",
|
||||||
|
"css-compile-free": "node-sass --output-style expanded --source-map true --source-map-contents true --precision 6 scss/free/free-icons.scss css/free.css",
|
||||||
"css-prefix": "postcss --config build/postcss.config.js --replace \"css/*.css\" \"!css/*.min.css\"",
|
"css-prefix": "postcss --config build/postcss.config.js --replace \"css/*.css\" \"!css/*.min.css\"",
|
||||||
"css-concat": "concat -o css/all.css css/free.css css/brand.css css/flag.css",
|
"css-concat": "concat -o css/all.css css/free.css css/brand.css css/flag.css",
|
||||||
"css-minify": "cleancss --level 1 --source-map --source-map-inline-sources --output css/all.min.css css/all.css",
|
"css-minify": "cleancss --level 1 --source-map --source-map-inline-sources --output css/all.min.css css/all.css",
|
||||||
"css-minify-free": "cleancss --level 1 --source-map --source-map-inline-sources --output css/free.min.css css/free.css",
|
|
||||||
"css-minify-brands": "cleancss --level 1 --source-map --source-map-inline-sources --output css/brand.min.css css/brand.css",
|
"css-minify-brands": "cleancss --level 1 --source-map --source-map-inline-sources --output css/brand.min.css css/brand.css",
|
||||||
"css-minify-flag": "cleancss --level 1 --source-map --source-map-inline-sources --output css/flag.min.css css/flag.css",
|
"css-minify-flag": "cleancss --level 1 --source-map --source-map-inline-sources --output css/flag.min.css css/flag.css",
|
||||||
"build": "npm-run-all --sequential build-*",
|
"css-minify-free": "cleancss --level 1 --source-map --source-map-inline-sources --output css/free.min.css css/free.css",
|
||||||
"build-js-files": "node build/build-js-files.js",
|
"js": "node build/build-js-files.js",
|
||||||
"build-svg-sprites": "node build/build-svg-sprites.js",
|
"svg-sprites": "node build/build-svg-sprites.js",
|
||||||
"build-png": "node build/generate-png.js",
|
"png": "node build/build-png.js --sizes={16,32}",
|
||||||
"dist": "npm-run-all --sequential clean css build",
|
"examples": "node build/build-examples.js",
|
||||||
"watch-css": "nodemon --ignore dist/ -e scss -x \"npm run css\""
|
"build": "npm-run-all --sequential copy icons-list optimize fonts scss-variables --parallel css js svg-sprites examples png",
|
||||||
|
"dist": "npm-run-all --sequential clean build",
|
||||||
|
"localhost": "http-server -o ./examples/"
|
||||||
},
|
},
|
||||||
"repository": {
|
"repository": {
|
||||||
"type": "git",
|
"type": "git",
|
||||||
@@ -59,18 +73,22 @@
|
|||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"clean-css-cli": "^4.3.0",
|
"clean-css-cli": "^4.3.0",
|
||||||
"concat": "^1.0.3",
|
"concat": "^1.0.3",
|
||||||
|
"http-server": "^0.12.1",
|
||||||
|
"minimist": "^1.2.0",
|
||||||
"mkdirp": "^0.5.1",
|
"mkdirp": "^0.5.1",
|
||||||
"node-sass": "^4.13.0",
|
"node-sass": "^4.13.0",
|
||||||
"npm-run-all": "^4.1.5",
|
"npm-run-all": "^4.1.5",
|
||||||
"postcss-cli": "^6.1.3",
|
"postcss-cli": "^6.1.3",
|
||||||
"rimraf": "^3.0.0",
|
"rimraf": "^3.0.0",
|
||||||
"sharp": "^0.23.3",
|
"sharp": "^0.23.2",
|
||||||
"shelljs": "^0.8.3",
|
"shelljs": "^0.8.3",
|
||||||
"stylelint": "^12.0.0",
|
"stylelint": "^11.1.1",
|
||||||
"stylelint-config-recommended-scss": "^4.0.0",
|
"stylelint-config-recommended-scss": "^4.0.0",
|
||||||
"stylelint-config-standard": "^19.0.0",
|
"stylelint-config-standard": "^19.0.0",
|
||||||
"stylelint-order": "^3.1.1",
|
"stylelint-order": "^3.1.1",
|
||||||
"stylelint-scss": "^3.12.1"
|
"stylelint-scss": "^3.12.1",
|
||||||
|
"svgo": "^1.3.2",
|
||||||
|
"webfont": "^9.0.0"
|
||||||
},
|
},
|
||||||
"files": [
|
"files": [
|
||||||
"css/",
|
"css/",
|
||||||
@@ -79,7 +97,6 @@
|
|||||||
"png/",
|
"png/",
|
||||||
"scss/",
|
"scss/",
|
||||||
"sprites/",
|
"sprites/",
|
||||||
"svg/",
|
"svg/"
|
||||||
"index.d.ts"
|
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user