Espeasy: Secara otomatis menghasilkan WebStaticData.h dari file sumber

Dibuat pada 22 Agu 2018  ·  5Komentar  ·  Sumber: letscontrolit/ESPEasy

Akan bermanfaat untuk menyimpan aset statis dalam format file aslinya (misalnya favicon.ico atau github-icon.svg ) dan menggunakan skrip untuk mengonversinya ke kode C yang diperlukan untuk WebStaticData.h . Dengan cara ini aset dapat dipertahankan tanpa melihat-lihat kode C atau melupakan terminator nol setelah mengedit CSS.

Bonus tambahannya adalah seseorang dapat mengoptimalkan file dengan plugin eksternal seperti svgo atau jsmin sebelum menulisnya ke file. Seseorang dapat melihat WI-PWN untuk mendapatkan inspirasi meskipun saya akan menggunakan skrip sederhana (bash/python/...) untuk menghasilkan file.

Build Enhancement

Semua 5 komentar

Ini adalah saran yang bagus dan kita perlu melakukan sesuatu seperti ini untuk masa depan. Terima kasih telah membuat masalah. :+1:

Itu satu hal yang akan ditambahkan di masa depan.
Ini juga akan memungkinkan pengguna untuk menambahkan ikon baru sendiri.

Satu-satunya alasan mengapa hal itu belum terjadi adalah karena saya belum yakin tentang formatnya dan saya juga berpikir untuk memuat aset tersebut sebagai file ke SPIFF.

Terima kasih untuk tautannya!

Hanya untuk kelengkapan: Saya membuat skrip untuk tugas ini beberapa waktu lalu. Ini pada dasarnya adalah salinan skrip oleh Erick B. Tedeschi dan spacehuhn . Repo untuk esp8266_deauther juga berisi skrip (python) lain untuk tugas ini .

#!/bin/bash

#
# This script walks through the assets folder and minifys all JS, HTML, CSS and SVG files. It also generates
# the corresponding constants that are added to the data.h file on esp8266_deauther folder.
#
# <strong i="8">@Author</strong> Erick B. Tedeschi < erickbt86 [at] gmail [dot] com >
# <strong i="9">@Author</strong> Wandmalfarbe https://github.com/Wandmalfarbe
#

outputfile="$(pwd)/data_h_temp"

rm $outputfile

function minify_html_css {
    file=$1
    curl -X POST -s --data-urlencode "input@$file" http://html-minifier.com/raw > /tmp/converter.temp
}

function minify_js {
    file=$1
    curl -X POST -s --data-urlencode "input@$file" https://javascript-minifier.com/raw > /tmp/converter.temp
}

function minify_svg {
    file=$1
    svgo -i /Users/User/Desktop/icons/tools.svg -o - > /tmp/converter.temp
}

function ascii2hexCstyle {
    file_name=$(constFileName $1)
    result=$(cat /tmp/converter.temp | hexdump -ve '1/1 "0x%.2x,"')
    result=$(echo $result | sed 's/,$//')
    echo "const char DATA_${file_name}[] PROGMEM = {$result};"
}

function constFileName {
    extension=$(echo $1 | egrep -io "(json|svg|css|js|html)$" | tr "[:lower:]" "[:upper:]")
    file=$(echo $1 | sed 's/\.json//' | sed 's/\.svg//' | sed 's/\.css//' | sed 's/\.html//' | sed 's/\.js//' | sed 's/\.\///' | tr '/' '_' | tr '.' '_' | tr '-' '_' | tr "[:lower:]" "[:upper:]")
    underscore="_"
    echo $file$underscore$extension
}


cd assets
file_list=$(find . -type f)

for file in $file_list; do
    echo "Processing: $file"
    file_name=$(constFileName $file)
    echo "  Array Name: $file_name"

    if [[ "$file" == *.min.js ]]; then
        echo "  JS already minified"
        cat $file > /tmp/converter.temp
        ascii2hexCstyle $file >> $outputfile
    elif [[ "$file" == *.js ]]; then
        echo "  JS minify"
        minify_js $file
        ascii2hexCstyle $file >> $outputfile
    elif [[ "$file" == *.min.css ]]; then
        echo "  CSS already minified"
        cat $file > /tmp/converter.temp
        ascii2hexCstyle $file >> $outputfile
    elif [[ "$file" == *.html ]] || [[ "$file" == *.css ]]; then
        echo "  HTML and CSS minify"
        minify_html_css $file
        ascii2hexCstyle $file >> $outputfile
    elif [[ "$file" == *.svg ]]; then
        echo "  SVG minify"
        minify_svg $file
        ascii2hexCstyle $file >> $outputfile
    else
        echo "  without minifier"
        cat $file > /tmp/converter.temp
        ascii2hexCstyle $file >> $outputfile
    fi
    echo ""
    sleep 1
done

Saya akan mencoba melakukan ini, sehingga kami dapat mengecilkan semua JavaScript yang disematkan.
Mungkin juga merupakan ide yang baik untuk membiarkan kode dapat dibaca untuk build yang memiliki flash 4 MB.

Ooooh, musik yang manis di telingaku @TD-er :)

Apakah halaman ini membantu?
0 / 5 - 0 peringkat