This repository has been archived on 2023-08-30. You can view files and clone it, but cannot push or open issues/pull-requests.
bytedo
/
wcui
Archived
1
0
Fork 0

使用esbuild替换terser

old
宇天 2021-11-24 11:09:28 +08:00
parent 623ec60f2c
commit 4eff159b34
3 changed files with 47 additions and 52 deletions

View File

@ -7,6 +7,7 @@ const path = require('path')
const scss = require('sass') const scss = require('sass')
const chokidar = require('chokidar') const chokidar = require('chokidar')
const chalk = require('chalk') const chalk = require('chalk')
const { transform } = require('esbuild')
const sourceDir = path.resolve(__dirname, 'src') const sourceDir = path.resolve(__dirname, 'src')
const buildDir = path.resolve(__dirname, 'dist') const buildDir = path.resolve(__dirname, 'dist')
@ -14,6 +15,11 @@ const buildDir = path.resolve(__dirname, 'dist')
const VERSION = require('./package.json').version const VERSION = require('./package.json').version
const BUILD_DATE = new Date().format() const BUILD_DATE = new Date().format()
const ESBUILD_OPTIONS = {
sourcemap: false,
target: 'es2017',
format: 'esm'
}
const BASE_SCSS = ` const BASE_SCSS = `
* { * {
box-sizing: border-box; box-sizing: border-box;
@ -30,18 +36,19 @@ function parseName(str) {
function fixImport(str) { function fixImport(str) {
return str return str
.replace(/import '([\w-/_.]*)'/g, 'import "$1.js"') .replace(/import '([\w-/_.]*)'/g, 'import "$1.js"')
.replace( .replace(/import ([\w\s,{}$]*) from '([a-z0-9\/\.\-_]*)'/g, 'import $1 from "$2.js"')
/import ([\w\s,{}$]*) from '([a-z0-9\/\.\-_]*)'/g,
'import $1 from "$2.js"'
)
} }
function compileJs(entry, output) { function compileJs(entry, output) {
var t1 = Date.now()
var buf = fs.cat(entry).toString() var buf = fs.cat(entry).toString()
var code = fixImport(buf)
log('编译JS: %s', chalk.green(entry)) buf = fixImport(buf)
fs.echo(code, output)
transform(buf, ESBUILD_OPTIONS).then(res => {
log('编译JS: %s, 耗时 %s ms', chalk.green(entry), chalk.yellow(Date.now() - t1))
fs.echo(res.code, output)
})
} }
// 编译样式 // 编译样式
@ -97,12 +104,10 @@ function mkWCFile({ style, html, js }) {
) )
.replace('mounted()', 'connectedCallback()') .replace('mounted()', 'connectedCallback()')
.replace('unmounted()', 'disconnectedCallback()') .replace('unmounted()', 'disconnectedCallback()')
.replace( .replace('watch() {', 'attributeChangedCallback(name, old, val) {\nif (old === val) {return}')
'watch() {',
'attributeChangedCallback(name, old, val) {\nif (old === val) {return}'
)
.replace('adopted()', 'adoptedCallback()') .replace('adopted()', 'adoptedCallback()')
return transform(js, ESBUILD_OPTIONS).then(res => {
return `/** return `/**
* *
* @authors yutent (yutent.io@gmail.com) * @authors yutent (yutent.io@gmail.com)
@ -111,16 +116,17 @@ function mkWCFile({ style, html, js }) {
* *
*/ */
${js} ${res.code}
if(!customElements.get('wc-${parseName(name)}')){ if(!customElements.get('wc-${parseName(name)}')){
customElements.define('wc-${parseName(name)}', ${name}) customElements.define('wc-${parseName(name)}', ${name})
} }
` `
})
} }
const compileWC = (entry, output) => { const compileWC = (entry, output) => {
log('编译wc: %s', chalk.green(entry)) var t1 = Date.now()
let code = fs.cat(entry).toString() let code = fs.cat(entry).toString()
let style = code.match(/<style[^>]*?>([\w\W]*?)<\/style>/) let style = code.match(/<style[^>]*?>([\w\W]*?)<\/style>/)
let html = code.match(/<template>([\w\W]*?)<\/template>/) let html = code.match(/<template>([\w\W]*?)<\/template>/)
@ -130,8 +136,10 @@ const compileWC = (entry, output) => {
html = html ? html[1] : '' html = html ? html[1] : ''
js = js ? js[1] : '' js = js ? js[1] : ''
let result = mkWCFile({ style, html, js }) mkWCFile({ style, html, js }).then(txt => {
fs.echo(result, output) log('编译WC: %s, 耗时 %s ms', chalk.green(entry), chalk.yellow(Date.now() - t1))
fs.echo(txt, output)
})
} }
/*=======================================================*/ /*=======================================================*/

View File

@ -6,7 +6,7 @@ const fs = require('iofs')
const path = require('path') const path = require('path')
const scss = require('sass') const scss = require('sass')
const chalk = require('chalk') const chalk = require('chalk')
const { minify } = require('terser') const { transform } = require('esbuild')
const sourceDir = path.resolve(__dirname, 'src') const sourceDir = path.resolve(__dirname, 'src')
const buildDir = path.resolve(__dirname, 'dist') const buildDir = path.resolve(__dirname, 'dist')
@ -14,6 +14,12 @@ const buildDir = path.resolve(__dirname, 'dist')
const VERSION = require('./package.json').version const VERSION = require('./package.json').version
const BUILD_DATE = new Date().format() const BUILD_DATE = new Date().format()
const ESBUILD_OPTIONS = {
sourcemap: false,
target: 'es2017',
format: 'esm',
minify: true
}
const BASE_SCSS = ` const BASE_SCSS = `
* { * {
box-sizing: border-box; box-sizing: border-box;
@ -30,10 +36,7 @@ function parseName(str) {
function fixImport(str) { function fixImport(str) {
return str return str
.replace(/import '([\w-/_.]*)'/g, 'import "$1.js"') .replace(/import '([\w-/_.]*)'/g, 'import "$1.js"')
.replace( .replace(/import ([\w\s,{}$]*) from '([a-z0-9\/\.\-_]*)'/g, 'import $1 from "$2.js"')
/import ([\w\s,{}$]*) from '([a-z0-9\/\.\-_]*)'/g,
'import $1 from "$2.js"'
)
} }
function compileJs(entry, output) { function compileJs(entry, output) {
@ -42,12 +45,8 @@ function compileJs(entry, output) {
buf = fixImport(buf) buf = fixImport(buf)
minify(buf, { sourceMap: false }).then(res => { transform(buf, ESBUILD_OPTIONS).then(res => {
log( log('编译JS: %s, 耗时 %s ms', chalk.green(entry), chalk.yellow(Date.now() - t1))
'编译JS: %s, 耗时 %s ms',
chalk.green(entry),
chalk.yellow(Date.now() - t1)
)
fs.echo(res.code, output) fs.echo(res.code, output)
}) })
} }
@ -112,13 +111,10 @@ function mkWCFile({ style, html, js }) {
) )
.replace('mounted()', 'connectedCallback()') .replace('mounted()', 'connectedCallback()')
.replace('unmounted()', 'disconnectedCallback()') .replace('unmounted()', 'disconnectedCallback()')
.replace( .replace('watch() {', 'attributeChangedCallback(name, old, val) {\nif (old === val) {return}')
'watch() {',
'attributeChangedCallback(name, old, val) {\nif (old === val) {return}'
)
.replace('adopted()', 'adoptedCallback()') .replace('adopted()', 'adoptedCallback()')
return minify(js, { sourceMap: false }).then(res => { return transform(js, ESBUILD_OPTIONS).then(res => {
return `/** return `/**
* *
* @authors yutent (yutent.io@gmail.com) * @authors yutent (yutent.io@gmail.com)
@ -148,11 +144,7 @@ const compileWC = (entry, output) => {
js = js ? js[1] : '' js = js ? js[1] : ''
mkWCFile({ style, html, js }).then(txt => { mkWCFile({ style, html, js }).then(txt => {
log( log('编译WC: %s, 耗时 %s ms', chalk.green(entry), chalk.yellow(Date.now() - t1))
'编译WC: %s, 耗时 %s ms',
chalk.green(entry),
chalk.yellow(Date.now() - t1)
)
fs.echo(txt, output) fs.echo(txt, output)
}) })
} }

View File

@ -11,20 +11,15 @@
"url": "git+https://github.com/bytedo/wcui.git" "url": "git+https://github.com/bytedo/wcui.git"
}, },
"main": "dist/", "main": "dist/",
"keywords": [ "keywords": ["web-components", "wc", "components", "yutent"],
"web-components",
"wc",
"components",
"yutent"
],
"author": "yutent", "author": "yutent",
"license": "MIT", "license": "MIT",
"devDependencies": { "devDependencies": {
"chalk": "^2.4.2", "chalk": "^3.0.0",
"chokidar": "^1.7.0", "chokidar": "^3.5.2",
"es.shim": "^2.0.1", "es.shim": "^2.0.2",
"iofs": "^1.5.2", "iofs": "^1.5.2",
"sass": "^1.32.5", "sass": "^1.43.4",
"terser": "^5.0.0" "esbuild": "^0.13.15"
} }
} }