Web Maker插件 - 前端代碼編輯

Web Maker插件背景簡介

作為一名程序員他的基本工作就是碼代碼，因此大多數工作時間都是在和代碼編輯器打交道。我們網站介紹了許多的代碼編輯器，比如文本編輯工具Notepad++和UltraEdit代碼編輯器 ，它們的功能十分的強大。但是在一些需要快速記錄代碼的緊急場合中，打開這些編輯器編輯代碼就顯得比較麻煩了。因此一款可以快速打開并編輯代碼的軟件就必不可少了，今天小編就為大家帶來了這樣一款插件Web Maker。

Web Maker插件簡介

Web Maker插件是一款可以快速在瀏覽器上打開并編寫網頁代碼的chrome插件。它可以將我們瀏覽器的選項卡（可選） 轉換成 web 編譯器，我們可以在其中編寫 HTML、CSS 和 JavaScript，同時還可以實時預覽頁面效果，支持離線使用。使用該插件后讓你的谷歌瀏覽器就會擁有即時編輯代碼的功能。只需點擊插件圖標即可在新窗口中進行工作，能夠幫助使用者快速編輯代碼，并且能將代碼自動保存。

Web Maker插件功能

1、離線工作。
2、支持預處理：HTML（jade，markdown），CSS（SCSS，LESS，Atomic CSS，Stylus）和JavaScript（ES6，CoffeeScript，TypeScript）。
3、內置控制臺。
4、使用自動保存保存并加載您的作品。
5、隨時隨地進出口所有作品。
6、多個編輯器主題和其他可配置的設置。
7、字體選項+使用任何系統字體。
8、代碼自動完成。
9、很容易訪問只需在Chrome中打開一個新標簽頁，并可配置設置。
10、具有保存的折疊狀態的多個布局。
11、另存為HTML文件。
12、在CodePen中編輯。
13、預覽截圖捕獲。
14、在Github上開源。

Web Maker插件安裝使用

1、Web Maker插件離線安裝的方法參照一下方法：老版本chrome瀏覽器，首先在標簽頁輸入【chrome://extensions/】進入chrome擴展程序，解壓你在本站下載的插件，并拖入擴展程序頁即可。

2、最新版本的chrome瀏覽器直接拖放安裝時會出現“程序包無效CRX-HEADER-INVALID”的報錯信息，參照：Chrome插件安裝時出現"CRX-HEADER-INVALID"解決方法，安裝好后即可使用。

3、點擊右上角的Web Maker插件圖標，打開它的主界面，在主界面里，使用者可以編寫網頁代碼包括HTML、CSS和JavaScript。

4、若是想要對插件的功能進行一些調整的話，點擊右下角的齒輪按鈕即可打開設置窗口進行設置。

5、點擊“Add library”按鈕可以隨機改變右側文字圖標的顏色。

6、你可以隨時隨地進出口所有作品。

7、編輯完成后還可以實時預覽頁面效果。

Web Maker插件更新日志

v4.0.2
新的大修用戶界面。注意，文件”模式當前僅在Web應用程序中可用。
v.3.4.0
模板，Js13kGames模式等等！
v.3.3.0
移植到Preact.js
v.3.0.0
Web Maker現在作為Web應用程序-> https://webmakerapp.com/app/
v.2.9.7
添加了Tailwind CSS，更新了流行庫，并重構了代碼。
v 2.9.5
外部庫UX，窗格折疊和錯誤修復方面的改進
v.2.9.0
分離的預覽，Atomic CSS配置，查找/替換，更多設置和錯誤修正。
v.2.8.0
自動保存，自定義系統字體，可配置的自動完成功能，匹配的標簽突出顯示，錯誤修正和改進
v.2.7.1
許多錯誤修復和較小的改進
v.2.7.0
音叉功能，字體，錯誤修正和改進
v2.6.1
幾個錯誤修正。
v2.6.0
添加了內置控制臺。
v2.5.0
搜索已保存的項目，Atomic CSS支持，更多可配置的設置和錯誤修正。
v2.4.3
來自stripe.com的白名單腳本。
v2.4.2
改進的無限循環保護。
v2.4.0
導入/導出，編輯器主題，更多設置，vim綁定，添加庫策略更改。
v2.3.2
入門方面的改進，默認情況下不會替換新標簽頁，并且不會更新babel。
v2.3.0
預覽屏幕截圖捕獲（為此需要新的下載權限），鍵盤導航，自動代碼對齊和錯誤修正。
v2.2.2
自動補全中的錯誤修正
v2.2.0
代碼自動完成，全屏預覽，SASS支持和錯誤修正。

Web Maker插件聯系方式

提供方：https://webmaker.app