add image asset handler plugin
This commit is contained in:
parent
53543ecfd7
commit
4d3bd748db
@ -18,8 +18,9 @@
|
|||||||
"typescript": "^3.7.4"
|
"typescript": "^3.7.4"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
"@rollup/plugin-buble": "^0.21.0",
|
||||||
"@rollup/plugin-commonjs": "^11.0.1",
|
"@rollup/plugin-commonjs": "^11.0.1",
|
||||||
"@rollup/plugin-node-resolve": "^7.0.0",
|
"@rollup/plugin-image": "^2.0.4",
|
||||||
"@rollup/plugin-buble": "^0.21.0"
|
"@rollup/plugin-node-resolve": "^7.0.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -3,8 +3,50 @@ import commonjs from '@rollup/plugin-commonjs'
|
|||||||
import bundles from './build/index'
|
import bundles from './build/index'
|
||||||
import fs from 'fs'
|
import fs from 'fs'
|
||||||
import path from 'path'
|
import path from 'path'
|
||||||
import buble from '@rollup/plugin-buble';
|
import buble from '@rollup/plugin-buble'
|
||||||
import json from "@rollup/plugin-json"
|
import json from "@rollup/plugin-json"
|
||||||
|
import image from '@rollup/plugin-image'
|
||||||
|
|
||||||
|
function searchImages(dir, images) {
|
||||||
|
const files = fs.readdirSync(dir)
|
||||||
|
files.forEach((item, index) => {
|
||||||
|
var fullPath = path.join(dir, item)
|
||||||
|
const stat = fs.statSync(fullPath)
|
||||||
|
if (stat.isDirectory()) {
|
||||||
|
searchImages(path.join(dir, item), images)
|
||||||
|
} else {
|
||||||
|
if(fullPath.endsWith('.png')) {
|
||||||
|
images.push(fullPath)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return images
|
||||||
|
}
|
||||||
|
|
||||||
|
const allImages = []
|
||||||
|
searchImages('src', allImages)
|
||||||
|
|
||||||
|
function mkdirsSync(dirname) {
|
||||||
|
if (fs.existsSync(dirname)) {
|
||||||
|
return true
|
||||||
|
} else {
|
||||||
|
if (mkdirsSync(path.dirname(dirname))) {
|
||||||
|
fs.mkdirSync(dirname)
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
allImages.forEach((value) => {
|
||||||
|
let path = __dirname + '/build/' + value
|
||||||
|
let index = path.lastIndexOf('/')
|
||||||
|
mkdirsSync(path.substring(0, index))
|
||||||
|
|
||||||
|
fs.copyFile(__dirname + '/' + value, __dirname + '/build/' + value, error => {
|
||||||
|
console.log(error)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
function readDirs(dirPath, files) {
|
function readDirs(dirPath, files) {
|
||||||
if (fs.statSync(dirPath).isDirectory()) {
|
if (fs.statSync(dirPath).isDirectory()) {
|
||||||
@ -51,11 +93,12 @@ export default
|
|||||||
resolve({ mainFields: ["jsnext"] }),
|
resolve({ mainFields: ["jsnext"] }),
|
||||||
commonjs(),
|
commonjs(),
|
||||||
json(),
|
json(),
|
||||||
|
image(),
|
||||||
],
|
],
|
||||||
external: ['reflect-metadata', 'doric'],
|
external: ['reflect-metadata', 'doric'],
|
||||||
onwarn: function (warning) {
|
onwarn: function (warning) {
|
||||||
if (warning.code === 'THIS_IS_UNDEFINED') { return; }
|
if (warning.code === 'THIS_IS_UNDEFINED') { return }
|
||||||
console.warn(warning.message);
|
console.warn(warning.message)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}).concat(
|
}).concat(
|
||||||
@ -76,11 +119,12 @@ export default
|
|||||||
buble({
|
buble({
|
||||||
transforms: { dangerousForOf: true }
|
transforms: { dangerousForOf: true }
|
||||||
}),
|
}),
|
||||||
|
image(),
|
||||||
],
|
],
|
||||||
external: ['reflect-metadata', 'doric'],
|
external: ['reflect-metadata', 'doric'],
|
||||||
onwarn: function (warning) {
|
onwarn: function (warning) {
|
||||||
if (warning.code === 'THIS_IS_UNDEFINED') { return; }
|
if (warning.code === 'THIS_IS_UNDEFINED') { return }
|
||||||
console.warn(warning.message);
|
console.warn(warning.message)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}))
|
}))
|
@ -1,8 +1,11 @@
|
|||||||
import { Group, Panel, coordinator, text, gravity, Color, LayoutSpec, log, vlayout, scroller, layoutConfig, image, ScaleType, Image } from "doric";
|
import { Group, Panel, coordinator, text, gravity, Color, LayoutSpec, log, vlayout, scroller, layoutConfig, image, ScaleType, Image } from "doric";
|
||||||
import { colors, label } from "./utils";
|
import { colors, label } from "./utils";
|
||||||
import { img_base64 } from "./image_base64";
|
import { img_base64 } from "./image_base64";
|
||||||
|
|
||||||
const imageUrl = 'https://img.zcool.cn/community/01e75b5da933daa801209e1ffa4649.jpg@1280w_1l_2o_100sh.jpg'
|
const imageUrl = 'https://img.zcool.cn/community/01e75b5da933daa801209e1ffa4649.jpg@1280w_1l_2o_100sh.jpg'
|
||||||
|
|
||||||
|
import logo from "./images/logo_w.png"
|
||||||
|
|
||||||
@Entry
|
@Entry
|
||||||
class ImageDemo extends Panel {
|
class ImageDemo extends Panel {
|
||||||
build(rootView: Group): void {
|
build(rootView: Group): void {
|
||||||
@ -124,7 +127,16 @@ class ImageDemo extends Panel {
|
|||||||
right: 0.149,
|
right: 0.149,
|
||||||
bottom: 0
|
bottom: 0
|
||||||
}
|
}
|
||||||
})
|
}),
|
||||||
|
label('Asset Image'),
|
||||||
|
image({
|
||||||
|
imageBase64: logo,
|
||||||
|
width: 235,
|
||||||
|
height: 235,
|
||||||
|
backgroundColor: Color.BLACK,
|
||||||
|
scaleType: ScaleType.ScaleAspectFill,
|
||||||
|
layoutConfig: layoutConfig().just(),
|
||||||
|
}),
|
||||||
],
|
],
|
||||||
{
|
{
|
||||||
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.FIT),
|
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.FIT),
|
||||||
|
4
doric-demo/src/image.d.ts
vendored
Normal file
4
doric-demo/src/image.d.ts
vendored
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
declare module '*.png' {
|
||||||
|
const value: any;
|
||||||
|
export default value;
|
||||||
|
}
|
BIN
doric-demo/src/images/logo_w.png
Normal file
BIN
doric-demo/src/images/logo_w.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 14 KiB |
Reference in New Issue
Block a user