Compare commits
No commits in common. "master" and "1.3.0" have entirely different histories.
7
index.js
7
index.js
|
@ -19,7 +19,6 @@ const IS_WINDOWS = process.platform === 'win32'
|
|||
const CONFIG_FILE = normalize(join(WORK_SPACE, 'fite.config.js'))
|
||||
const PROTOCOL = IS_WINDOWS ? 'file://' : ''
|
||||
const NODE_VERSION = process.versions.node.split('.').map(n => +n)
|
||||
const ABS_CONFIG_FILEPATH = PROTOCOL + CONFIG_FILE
|
||||
|
||||
let args = process.argv.slice(2)
|
||||
let mode = args.shift() || 'prod'
|
||||
|
@ -41,9 +40,8 @@ switch (mode) {
|
|||
case 'dev':
|
||||
process.env.NODE_ENV = 'development'
|
||||
|
||||
import(ABS_CONFIG_FILEPATH)
|
||||
import(PROTOCOL + CONFIG_FILE)
|
||||
.then(function (conf) {
|
||||
conf.default.ABS_CONFIG_FILEPATH = ABS_CONFIG_FILEPATH
|
||||
createServer(WORK_SPACE, conf.default)
|
||||
})
|
||||
.catch(err => {
|
||||
|
@ -54,14 +52,13 @@ switch (mode) {
|
|||
case 'build':
|
||||
process.env.NODE_ENV = 'production'
|
||||
|
||||
import(ABS_CONFIG_FILEPATH)
|
||||
import(PROTOCOL + CONFIG_FILE)
|
||||
.then(function (conf) {
|
||||
let dist = conf.buildDir || 'dist'
|
||||
if (clean && fs.isdir(dist)) {
|
||||
console.log('清除dist目录...')
|
||||
fs.rm(dist)
|
||||
}
|
||||
conf.default.ABS_CONFIG_FILEPATH = ABS_CONFIG_FILEPATH
|
||||
compile(WORK_SPACE, dist, conf.default, verbose)
|
||||
})
|
||||
.catch(err => {
|
||||
|
|
|
@ -64,7 +64,7 @@ function scopeCss(css = '', hash) {
|
|||
if (last.startsWith(':')) {
|
||||
output = parseVDeep(last, output, true)
|
||||
} else {
|
||||
output = `${last}[data-${hash}] ${output}`
|
||||
output = `${last} ${output}`
|
||||
}
|
||||
} else {
|
||||
if (last.includes(':')) {
|
||||
|
@ -115,7 +115,7 @@ export function compileScss(file, inject = '') {
|
|||
export function parseJs(
|
||||
code = '',
|
||||
imports,
|
||||
{ IS_MPA, currentPage, IS_ENTRY, DEPLOY_PATH, LEGACY_MODE, define } = {},
|
||||
{ IS_MPA, currentPage, IS_ENTRY, DEPLOY_PATH, LEGACY_MODE } = {},
|
||||
filename,
|
||||
linePatch = 1
|
||||
) {
|
||||
|
@ -159,6 +159,7 @@ export function parseJs(
|
|||
if (name.startsWith('@/')) {
|
||||
name = name.replace('@/', urlJoin(DEPLOY_PATH, ASSETS_DIR))
|
||||
}
|
||||
let isJson = name.endsWith('.json')
|
||||
|
||||
if (!imports[name]) {
|
||||
if (name.startsWith('./') || name.startsWith('../')) {
|
||||
|
@ -178,6 +179,7 @@ export function parseJs(
|
|||
|
||||
if (
|
||||
!name.endsWith('.js') &&
|
||||
!isJson &&
|
||||
!name.endsWith('.mjs') &&
|
||||
!name.endsWith('.vue')
|
||||
) {
|
||||
|
@ -200,9 +202,14 @@ export function parseJs(
|
|||
_alias = ' default ' + alias.replace('* as', '').trim()
|
||||
}
|
||||
|
||||
_import = `import ${alias} from '${name}'`
|
||||
if (LEGACY_MODE && isJson) {
|
||||
_import = `const ${alias} = await __fite_import('${name}', import.meta.url)`
|
||||
} else {
|
||||
_import = `import ${alias} from '${name}'${
|
||||
isJson ? ' assert { type: "json" }' : ''
|
||||
}`
|
||||
}
|
||||
_import += t === 'export' ? `\nexport ${_alias}` : ''
|
||||
|
||||
return _import
|
||||
}
|
||||
)
|
||||
|
@ -213,9 +220,6 @@ export function parseJs(
|
|||
if (name.startsWith('@/')) {
|
||||
name = name.replace('@/', urlJoin(DEPLOY_PATH, ASSETS_DIR))
|
||||
}
|
||||
if (name.endsWith('.json')) {
|
||||
name += '.js'
|
||||
}
|
||||
return `import('${name}')`
|
||||
})
|
||||
.replace(/import (["'])(.*?)\1/g, function (m, q, name) {
|
||||
|
@ -231,30 +235,19 @@ export function parseJs(
|
|||
let _name = name.replace(/\\/g, '/').replace('@/', '')
|
||||
let tmp = `style_${uuid()}`
|
||||
|
||||
// 因为esm语法的变更, 原先的 import xx from xx assets {type: css} 变为了 with
|
||||
// 而这个语法的变化, 构建工具无法做版本判断, 故, 统一降级到fetch()加载
|
||||
if (LEGACY_MODE) {
|
||||
fixedStyle +=
|
||||
`{\n` +
|
||||
` let stylesheet = document.createElement('style');\n` +
|
||||
` stylesheet.setAttribute('name', '${_name}');\n` +
|
||||
` stylesheet.textContent = ${tmp};\n` +
|
||||
` document.head.appendChild(stylesheet);\n` +
|
||||
`}\n`
|
||||
|
||||
return `let ${tmp};\n!(async function(){\n ${tmp} = await __fite_import('${name}', import.meta.url);\n})()`
|
||||
fixedStyle += `${tmp}.then(r => {
|
||||
let stylesheet = document.createElement('style')
|
||||
stylesheet.setAttribute('name', '${_name}')
|
||||
stylesheet.textContent = r
|
||||
document.head.appendChild(stylesheet)
|
||||
})
|
||||
`
|
||||
return `const ${tmp} = __fite_import('${name}', import.meta.url)`
|
||||
} else {
|
||||
// CSSStyleSheet.replaceSync 需要FF v101, Safari 16.4才支持
|
||||
fixedStyle +=
|
||||
`{\n` +
|
||||
` let stylesheet = new CSSStyleSheet();\n` +
|
||||
` stylesheet.path = '${_name}';\n` +
|
||||
` stylesheet.replaceSync(${tmp} );\n` +
|
||||
` __sheets__.push(stylesheet);\n` +
|
||||
` document.adoptedStyleSheets = __sheets__;\n` +
|
||||
`}\n`
|
||||
fixedStyle += `${tmp}.path = '${_name}'\n__sheets__.push(${tmp})\n`
|
||||
|
||||
return `const ${tmp} = await __fite_import('${name}', import.meta.url)`
|
||||
return `import ${tmp} from '${name}' assert { type: 'css' }`
|
||||
}
|
||||
} else {
|
||||
if (name.startsWith('@/')) {
|
||||
|
@ -279,6 +272,7 @@ export function parseJs(
|
|||
|
||||
if (
|
||||
!name.endsWith('.js') &&
|
||||
!name.endsWith('.json') &&
|
||||
!name.endsWith('.mjs') &&
|
||||
!name.endsWith('.vue')
|
||||
) {
|
||||
|
@ -290,10 +284,6 @@ export function parseJs(
|
|||
}
|
||||
})
|
||||
|
||||
for (let key in define) {
|
||||
code = code.replaceAll(key, define[key])
|
||||
}
|
||||
|
||||
if (fixedStyle) {
|
||||
code += '\n\n' + (IS_ENTRY ? SHEETS_DEF : '') + fixedStyle
|
||||
|
||||
|
@ -310,7 +300,7 @@ export function parseJs(
|
|||
* @param file <String> 文件路径
|
||||
* @return <String> 返回转换后的js代码
|
||||
*/
|
||||
export async function compileVue(file, imports, options = {}) {
|
||||
export function compileVue(file, imports, options = {}) {
|
||||
// 修正那反人类的windows路径
|
||||
let filename = file.slice(options.SOURCE_DIR.length).replace(/\\/g, '/')
|
||||
let code = (fs.cat(file) || '').toString().replace(/\r\n/g, '\n')
|
||||
|
@ -340,15 +330,10 @@ export async function compileVue(file, imports, options = {}) {
|
|||
} else {
|
||||
css = compileScss(it[1], options.INJECT_SCSS)
|
||||
}
|
||||
|
||||
return css
|
||||
})
|
||||
.join(' ')
|
||||
|
||||
for (let fn of options.plugin) {
|
||||
scss = await fn('css', scss)
|
||||
}
|
||||
|
||||
js = js ? js[1] : 'export default {}'
|
||||
|
||||
try {
|
||||
|
@ -454,7 +439,9 @@ export function parseHtml(html, { page, imports, entry, LEGACY_MODE }) {
|
|||
`${
|
||||
process.env.NODE_ENV === 'development'
|
||||
? ` <script>${minify(createHmrScript(LEGACY_MODE))}</script>\n`
|
||||
: ` <script>${minify(LEGACY_POLYFILL)}</script>\n`
|
||||
: LEGACY_MODE
|
||||
? ` <script>${minify(LEGACY_POLYFILL)}</script>\n`
|
||||
: ''
|
||||
}</head>`
|
||||
)
|
||||
.replace('{{title}}', page.title || '')
|
||||
|
|
|
@ -44,14 +44,11 @@ export async function compileFiles(
|
|||
switch (it.ext) {
|
||||
case '.vue':
|
||||
{
|
||||
let code = await compileVue(path, imports, options)
|
||||
let code = compileVue(path, imports, options)
|
||||
|
||||
await Es.transform(code, { minify: true }).then(async ({ code }) => {
|
||||
for (let fn of options.plugin) {
|
||||
code = await fn('js', code)
|
||||
}
|
||||
await Es.transform(code, { minify: true }).then(r => {
|
||||
fs.echo(
|
||||
code,
|
||||
r.code,
|
||||
join(dist, 'assets/', pageDir, it.name.replace(/\.vue$/, '.js'))
|
||||
)
|
||||
})
|
||||
|
@ -64,23 +61,19 @@ export async function compileFiles(
|
|||
|
||||
code = parseJs(code + '', imports, options)
|
||||
|
||||
await Es.transform(code, { minify: true }).then(async ({ code }) => {
|
||||
for (let fn of options.plugin) {
|
||||
code = await fn('js', code)
|
||||
}
|
||||
fs.echo(code, join(dist, 'assets/', pageDir, it.name))
|
||||
await Es.transform(code, { minify: true }).then(r => {
|
||||
fs.echo(r.code, join(dist, 'assets/', pageDir, it.name))
|
||||
})
|
||||
}
|
||||
break
|
||||
// es2024之后esm的语法的assets 变成了with, 对构建工具来说无法适配到具体的浏览器
|
||||
// 故把json文件改成js文件
|
||||
|
||||
case '.json':
|
||||
{
|
||||
let code = fs.cat(path)
|
||||
|
||||
code = 'export default ' + JSON.stringify(JSON.parse(code + ''))
|
||||
code = JSON.stringify(JSON.parse(code + ''))
|
||||
|
||||
fs.echo(code, join(dist, 'assets/', pageDir, it.name + '.js'))
|
||||
fs.echo(code, join(dist, 'assets/', pageDir, it.name))
|
||||
}
|
||||
break
|
||||
|
||||
|
@ -97,9 +90,6 @@ export async function compileFiles(
|
|||
fs.cp(path, target)
|
||||
} else {
|
||||
let code = compileScss(path)
|
||||
for (let fn of options.plugin) {
|
||||
code = await fn('css', code)
|
||||
}
|
||||
fs.echo(code, target)
|
||||
}
|
||||
}
|
||||
|
|
|
@ -40,11 +40,12 @@ export const LEGACY_POLYFILL = `!(function(){
|
|||
}
|
||||
|
||||
window.__fite_import = function(url,relPath){
|
||||
let isJson = url.endsWith('.json')
|
||||
let absPath = relPath.split('/').slice(0, -1).join('/')
|
||||
let req
|
||||
if(url.startsWith('./') || url.startsWith('../')) {
|
||||
url = join(absPath, url)
|
||||
}
|
||||
return window.fetch(url).then(r => r.text())
|
||||
return window.fetch(url).then(r => isJson ? r.json() : r.text())
|
||||
}
|
||||
})()`
|
||||
|
|
64
lib/dev.js
64
lib/dev.js
|
@ -34,7 +34,6 @@ export default async function createServer(root = '', conf = {}) {
|
|||
const LEGACY_MODE = !!conf.legacy
|
||||
const ENABLE_GZIP = !!conf.devServer.gzip
|
||||
const { isCustomElement = defaultCustomElement } = conf.compileOptions || {}
|
||||
const { plugin = [], define = {} } = conf
|
||||
|
||||
if (conf.imports['vue-dev']) {
|
||||
conf.imports.vue = conf.imports['vue-dev']
|
||||
|
@ -74,7 +73,7 @@ export default async function createServer(root = '', conf = {}) {
|
|||
currentPage = ''
|
||||
|
||||
server
|
||||
.on('request', async function (req, res) {
|
||||
.on('request', function (req, res) {
|
||||
let prefix = DEPLOY_PATH ? DEPLOY_PATH.replace(/\/$/, '') : ''
|
||||
let url =
|
||||
prefix && req.url.startsWith(prefix)
|
||||
|
@ -179,18 +178,11 @@ export default async function createServer(root = '', conf = {}) {
|
|||
currentPage,
|
||||
IS_ENTRY: true,
|
||||
DEPLOY_PATH,
|
||||
LEGACY_MODE,
|
||||
isCustomElement,
|
||||
plugin,
|
||||
define
|
||||
LEGACY_MODE
|
||||
},
|
||||
page.entry
|
||||
)
|
||||
|
||||
for (let fn of plugin) {
|
||||
entry = await fn('js', entry)
|
||||
}
|
||||
|
||||
code = parseHtml(html, {
|
||||
page,
|
||||
imports: conf.imports,
|
||||
|
@ -223,7 +215,7 @@ export default async function createServer(root = '', conf = {}) {
|
|||
return
|
||||
}
|
||||
|
||||
code = await compileVue(file, conf.imports, {
|
||||
code = compileVue(file, conf.imports, {
|
||||
IS_MPA,
|
||||
currentPage,
|
||||
SOURCE_DIR,
|
||||
|
@ -231,15 +223,9 @@ export default async function createServer(root = '', conf = {}) {
|
|||
DEPLOY_PATH,
|
||||
INJECT_SCSS,
|
||||
LEGACY_MODE,
|
||||
isCustomElement,
|
||||
plugin,
|
||||
define
|
||||
isCustomElement
|
||||
})
|
||||
|
||||
for (let fn of plugin) {
|
||||
code = await fn('js', code)
|
||||
}
|
||||
|
||||
res.setHeader('content-type', MIME_TYPES.js)
|
||||
}
|
||||
break
|
||||
|
@ -265,25 +251,15 @@ export default async function createServer(root = '', conf = {}) {
|
|||
return
|
||||
}
|
||||
code = compileScss(file)
|
||||
for (let fn of plugin) {
|
||||
code = await fn('css', code)
|
||||
}
|
||||
res.setHeader('content-type', MIME_TYPES.css)
|
||||
}
|
||||
break
|
||||
|
||||
case 'json':
|
||||
case 'js':
|
||||
case 'wasm':
|
||||
{
|
||||
let rpath = pathname.replace('@/', '')
|
||||
let file
|
||||
let isJson = false
|
||||
let isWasm = rpath.endsWith('.wasm')
|
||||
|
||||
if (rpath.endsWith('json.js')) {
|
||||
isJson = true
|
||||
rpath = rpath.slice(0, -3)
|
||||
}
|
||||
|
||||
if (IS_MPA) {
|
||||
// 判断前后2个值相等, 避免出现目录名和页面名字相同时走错逻辑
|
||||
|
@ -307,16 +283,7 @@ export default async function createServer(root = '', conf = {}) {
|
|||
res.end('')
|
||||
return
|
||||
}
|
||||
if (isJson) {
|
||||
try {
|
||||
code =
|
||||
'export default ' + JSON.stringify(JSON.parse(code + ''))
|
||||
} catch (err) {
|
||||
console.log('%s 语法错误: %s', rpath, red(err.message))
|
||||
}
|
||||
} else if (isWasm) {
|
||||
//
|
||||
} else {
|
||||
if (ext === 'js') {
|
||||
code = parseJs(
|
||||
code + '',
|
||||
conf.imports,
|
||||
|
@ -324,16 +291,10 @@ export default async function createServer(root = '', conf = {}) {
|
|||
IS_MPA,
|
||||
currentPage,
|
||||
DEPLOY_PATH,
|
||||
LEGACY_MODE,
|
||||
isCustomElement,
|
||||
plugin,
|
||||
define
|
||||
LEGACY_MODE
|
||||
},
|
||||
file
|
||||
)
|
||||
for (let fn of plugin) {
|
||||
code = await fn('js', code)
|
||||
}
|
||||
}
|
||||
res.setHeader('content-type', MIME_TYPES[ext])
|
||||
}
|
||||
|
@ -414,7 +375,7 @@ export default async function createServer(root = '', conf = {}) {
|
|||
)
|
||||
chokidar
|
||||
.watch([SOURCE_DIR, PUBLIC_DIR, join(root, './index.html')])
|
||||
.on('all', async (act, filePath) => {
|
||||
.on('all', (act, filePath) => {
|
||||
if (ready) {
|
||||
let file = filePath.slice(SOURCE_DIR.length)
|
||||
|
||||
|
@ -434,9 +395,6 @@ export default async function createServer(root = '', conf = {}) {
|
|||
} else {
|
||||
content = fs.cat(filePath).toString()
|
||||
}
|
||||
for (let fn of plugin) {
|
||||
content = await fn('css', content)
|
||||
}
|
||||
ws.send({
|
||||
action: 'render',
|
||||
data: { path: file.replace(/\\/g, '/'), content }
|
||||
|
@ -446,7 +404,7 @@ export default async function createServer(root = '', conf = {}) {
|
|||
|
||||
case 'vue':
|
||||
{
|
||||
let content = await compileVue(filePath, conf.imports, {
|
||||
let content = compileVue(filePath, conf.imports, {
|
||||
IS_MPA,
|
||||
currentPage,
|
||||
SOURCE_DIR,
|
||||
|
@ -454,9 +412,7 @@ export default async function createServer(root = '', conf = {}) {
|
|||
DEPLOY_PATH,
|
||||
INJECT_SCSS,
|
||||
LEGACY_MODE,
|
||||
isCustomElement,
|
||||
plugin,
|
||||
define
|
||||
isCustomElement
|
||||
})
|
||||
let tmp = CACHE[filePath]
|
||||
if (tmp.changed) {
|
||||
|
|
27
lib/prod.js
27
lib/prod.js
|
@ -52,13 +52,7 @@ export default function compile(root = '', dist = '', conf = {}, verbose) {
|
|||
)
|
||||
const INJECT_SCSS = readFile(conf.inject?.scss)
|
||||
const LEGACY_MODE = !!conf.legacy
|
||||
const {
|
||||
ABS_CONFIG_FILEPATH,
|
||||
compileOptions = {},
|
||||
define = {},
|
||||
plugin = []
|
||||
} = conf
|
||||
const { isCustomElement = defaultCustomElement } = compileOptions
|
||||
const { isCustomElement } = conf.compileOptions || {}
|
||||
|
||||
conf.inject = conf.inject || { scss: '' }
|
||||
|
||||
|
@ -71,8 +65,13 @@ export default function compile(root = '', dist = '', conf = {}, verbose) {
|
|||
DEPLOY_PATH,
|
||||
INJECT_SCSS,
|
||||
LEGACY_MODE,
|
||||
ABS_CONFIG_FILEPATH,
|
||||
define
|
||||
// 线程通讯无法传递函数类型, 需要转为字符串, 之后再转回来
|
||||
isCustomElement:
|
||||
THREADS_NUM > 0
|
||||
? isCustomElement
|
||||
? isCustomElement.toString()
|
||||
: null
|
||||
: isCustomElement || defaultCustomElement
|
||||
}
|
||||
|
||||
fs.ls(SOURCE_DIR, true).forEach(path => {
|
||||
|
@ -102,10 +101,7 @@ export default function compile(root = '', dist = '', conf = {}, verbose) {
|
|||
|
||||
// 创建线程池
|
||||
if (THREADS_NUM > 0 && (IS_MPA || list.size > THREADS_NUM * 10)) {
|
||||
// 页面数过少时, 线程数量不能比页面数多
|
||||
let max = Math.min(THREADS_NUM, PAGES_KEYS.length)
|
||||
|
||||
for (let i = 0; i < max; i++) {
|
||||
for (let i = 0; i < THREADS_NUM; i++) {
|
||||
WORKER_POOL.add(
|
||||
new Worker(join(__dirname, './thread.js'), {
|
||||
workerData: {
|
||||
|
@ -117,8 +113,6 @@ export default function compile(root = '', dist = '', conf = {}, verbose) {
|
|||
})
|
||||
)
|
||||
}
|
||||
} else {
|
||||
options.isCustomElement = isCustomElement
|
||||
}
|
||||
|
||||
// 优先处理静态目录, 之后的源码目录中, 以便如果有产生相同的文件名, 则覆盖静态目录中的文件
|
||||
|
@ -208,8 +202,7 @@ export default function compile(root = '', dist = '', conf = {}, verbose) {
|
|||
doJob()
|
||||
}
|
||||
} else {
|
||||
options.plugin = plugin
|
||||
options.isCustomElement = isCustomElement
|
||||
options.isCustomElement = isCustomElement || defaultCustomElement
|
||||
compileFiles(currentPage, page, list, options, {
|
||||
verbose,
|
||||
dist,
|
||||
|
|
|
@ -8,17 +8,11 @@ import { compileFiles } from './compile.js'
|
|||
import { defaultCustomElement } from './utils.js'
|
||||
|
||||
const { options, verbose, dist, imports } = workerData
|
||||
const { ABS_CONFIG_FILEPATH } = options
|
||||
|
||||
const { compileOptions = {}, plugin = [] } = await import(
|
||||
ABS_CONFIG_FILEPATH
|
||||
).then(r => r.default)
|
||||
options.isCustomElement = options.isCustomElement
|
||||
? Function('return ' + options.isCustomElement)()
|
||||
: defaultCustomElement
|
||||
|
||||
const { isCustomElement = defaultCustomElement } = compileOptions
|
||||
options.isCustomElement = isCustomElement
|
||||
options.plugin = plugin
|
||||
|
||||
//
|
||||
async function doJob(job) {
|
||||
let [currentPage, { page, files }] = job.entries().next().value
|
||||
|
||||
|
@ -34,7 +28,7 @@ async function doJob(job) {
|
|||
dist,
|
||||
imports
|
||||
})
|
||||
parentPort.postMessage(true)
|
||||
parentPort.postMessage('ok')
|
||||
}
|
||||
|
||||
parentPort.on('message', doJob)
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"name": "fite",
|
||||
"type": "module",
|
||||
"version": "1.4.4",
|
||||
"version": "1.3.0",
|
||||
"bin": {
|
||||
"fite": "index.js"
|
||||
},
|
||||
|
|
Loading…
Reference in New Issue