Mari jadikan web responsif dengan hanya satu baris pemasangan? Saya sedang mencari penyumbang!

Barbara Streisand
Lepaskan: 2024-11-06 09:04:02
asal
430 orang telah melayarinya

Baru-baru ini saya menerbitkan pakej NPM dengan misi yang diterangkan dalam tajuk: untuk menjadikan projek responsif dengan hanya satu baris kod!

Saya berkongsi dengan anda pakej [beta] apl responsif

Saya mengambil masa beberapa tahun untuk mencuba dan membangunkan teknik ini, yang pada masa ini terdiri daripada:

  1. Menetapkan saiz fon teg HTML secara dinamik (melalui skrip JS), dengan mengambil kira: (1) peleraian skrin dan (2) saiz fon penyemak imbas (untuk kebolehcapaian web)
  2. Praproses takrifan piksel menjadi rem
  3. Memusatkan elemen dalam skrin mudah alih (ciri percubaan)

Hasilnya ialah semua perkadaran elemen dan saiz relatif sama merentas semua resolusi skrin:

Let’s make the web responsive with just one installation line? I’m looking for contributors!

Dengan hanya satu pemasangan talian, contohnya menggunakan Rollup:

import responsive from 'rollup-plugin-responsive-app'

export default {
   …
   plugins: [
   …,
   // Last plugin on the list
   responsive()
   ],
};
Salin selepas log masuk

Atau meletakkan versi gabungan penyemak imbas ke dalam halaman:

<head>
    <script src="https://cdn.jsdelivr.net/npm/responsive-app@1.0.7-beta.0/dist/browser-bundle.min.js"></script>
</head>
Salin selepas log masuk

Matlamat utama di sini ialah menjimatkan masa semasa membuat projek baharu dengan tidak perlu berurusan dengan responsif sama sekali, hanya percaya bahawa antara muka akan kelihatan baik pada semua resolusi skrin. Bunyinya bagus, kan?

Jadi, selepas melancarkan versi beta ini, saya sedang mencari sokongan dan penyumbang. Pada mulanya, ideanya adalah untuk menguji pakej ini dalam konteks, projek dan rangka kerja yang berbeza (React, Angular, Vue…) untuk menjadikan proses itu selengkap mungkin.

Siapa yang bersedia untuk cabaran ini? Langkah-langkah ujian ialah:

  1. Pasang atau tambahkan teg skrip ke dalam apl baharu atau sedia ada anda 1.1 Jika anda mempunyai peraturan responsif sedia ada, pintaskannya
  2. Semak antara muka anda merentas berbilang resolusi
  3. Beri tahu saya cara ia berfungsi untuk anda :)

Atas ialah kandungan terperinci Mari jadikan web responsif dengan hanya satu baris pemasangan? Saya sedang mencari penyumbang!. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!