design system starter
1.0.0
Sistem Desain Pemerintah Australia telah dinonaktifkan mengunjungi halaman komunitas kami untuk informasi lebih lanjut
Mulailah dengan templat halaman penuh menggunakan sistem desain pemerintah Australia.
Jelajahi templat halaman penuh menggunakan sistem desain pemerintah Australia.
Kloning repositori ini untuk menciptakan lingkungan pengembangan lokal dan mulai memodifikasi templat.
Paket starter menggunakan NPM (Node Package Manager) untuk mengatur lingkungan pengembangan lokal dan menginstal komponen sistem desain. Manajer paket default untuk node adalah NPM. Saat Anda mengunduh Node, NPM dipasang sebelumnya.
Pastikan Anda memiliki NPM dan node yang diinstal di komputer Anda. Anda dapat mengikuti instruksi NPM jika Anda tidak yakin.
Unduh, klon, atau garpu repositori ini ke folder di komputer Anda.
Di baris perintah masuk ke folder ini dan jalankan npm install . Ini akan memasang dependensi yang diperlukan untuk lingkungan pengembangan lokal.
Anda sekarang harus siap untuk memulai server lokal Anda dengan menjalankan npm run watch . Ini akan menonton perubahan pada file *.scss , membuat file *.css baru dan menyegarkan browser.
Bangun gambar:
$ docker build -t ds-starter .Kemudian jalankan gambar dan peta volume. Catatan: $ PWD tidak didukung di Windows.
$ docker run --rm --volume= " $PWD :/app " -p 3000:3000 -it ds-starter⬆ Kembali ke atas
Di direktori Anda, Anda memiliki file package.json . File ini menunjuk ke dependensi untuk menginstal saat menjalankan npm install . Saat Anda menjalankan npm install Anda menginstal semua komponen sistem desain dan paket tambahan yang terkait dengan lingkungan pengembangan lokal.
Setelah npm install pancake dijalankan, ini memeriksa apakah ketergantungan Anda bekerja bersama dan membuat docs/js/script.min.js dan src/sass/_uikit.scss .
src/sass/main.scss mengimpor _uikit.scss yang dihasilkan. Anda tidak boleh menyentuh file _uikit.scss saat dihasilkan, tetapi jangan ragu untuk mengubah file main.scss .
Saat pengguna menjalankan npm run build atau npm run watch kami menggunakan node-sass untuk mengonversi file src/sass/main.scss ke dalam file docs/css/main.css . Autoprefixer dijalankan setelah kompilasi untuk menambahkan awalan vendor ke file main.css .
Merujuk ke skrip
package.jsonuntuk bagaimana ini telah diatur
Pengaturan ini memungkinkan Anda untuk memodifikasi variabel dalam file sistem desain dari file main.scss . Anda dapat menambahkan skema warna Anda sendiri, atau mengubah tipografi dan jarak. Tweak ke komponen atau tambahan harus ditambahkan di bawah impor _uikit.scss . Perubahan pada file -file ini akan disuntikkan ke browser Anda sehingga Anda bahkan tidak perlu menyegarkan terima kasih kepada Browser Sync.
Folder docs di yang berisi semua file yang diperlukan untuk menerbitkan situs web. File index.html merujuk pada file main.css dan script.min.js aset untuk menghasilkan halaman. Kami memberi nama folder docs karena halaman github menggunakan folder Docs untuk meng -host situs web statis.
⬆ Kembali ke atas
Node.js 8 atau lebih tinggi , lebih disukai versi LTS saat ini.Catatan: Jika Anda mengembangkan di Windows, harap pastikan bahwa konfigurasi
npmlokal Anda menggunakan shell yang mendukung Unix Like Folder Pathing (yaitua/unix/pathdaripadaa\windows\path).
⬆ Kembali ke atas
Untuk berkontribusi pada paket starter sistem desain pemerintah Australia:
⬆ Kembali ke atas
Hak Cipta (C) Persemakmuran Australia. Dengan pengecualian dari Commonwealth Coat of Arms dan di mana dicatat, pekerjaan ini dilisensikan di bawah lisensi MIT.
⬆ Kembali ke atas
