Front-end tools:
Sublime Text3
Download: HTTPS://WWW.SUBLIMETEXT.COM/3
English setting: https://jingyan.baidu.com/article/9c69d48fea00ca13c9024e18.html
Modify plug-in package location: https://www.cnblogs.com/xiterjia/p/5745826.html
How do I install plugins? Ctrl+shift+p-Input Install package-Input related plug-in name
The following plug-ins, which do not indicate the use of the method are installed
1. Html/css/js prettify
Front-End Code Quick Format shortcut key Ctrl+shift+h
Need environment node. js Download: https://nodejs.org/en/
Modify the associated operating system path in "Node_path"
2.Emmet Code Hints
3.Side? Bar? Enhancements
File-The file list appears to the left of the open folder
This tool is used to enhance the file list right mouse button optional function
4.sublime server turns on local server debugging
When you pick up the information from another page, you need to turn on the local server, or jquery will error
How to use: Open->sublimeserver->startsublimeserver-> in select HTML,
Right-click and select View in Sublimeserver
Note: The HTML to be debugged needs to be in the file list on the right.
5. Google Chrome Enhanced Plugin
Make sure you have access to the Google online store:
Https://chrome.google.com/webstore/category/extensions?hl=zh-CN
If not, download Google Access assistant: http://www.ggfwzs.com/
Google Access Assistant installation method:
(1) Open Google Chrome, open
(2) More tools, extension tools
(3) Drag the downloaded Google Access assistant to the Extension tool page for installation
4-1.livereload
Used to change the page information of Google Browser while sublime changes the code to save
(1) Open Google Online store, install Livereload plugin
(2) in the Google Expansion program interface, find the relevant plugin, click Details, find
Open it
(3) Install the plugin in sublime Livereload
How to use:
(1) ctrl+shift+p
(2) Open
(3) Open
(4) Start sublime server (not required)
(5) Open the *.html file you need to access, right-click on the view in Sublimeserver
(6)
4-2.livestyle
Bidirectional interaction for CSS in Google Chrome and sublime, changing the value of CSS code on one side
The other side also changes at the same time, that is, live updates
(1) Open Google Online store, install Livestyle (Emmet livestyle) Plugin
(2) in the Google Expansion program interface, find the relevant plugin, click Details, find
Open it
(3) Install the plugin in sublime Livestyle
How to use
(1) Open *.html file with sublime and *./css file to be associated
(2) Right click Sublimeserver Mode open (not required)
(3) Click, wait for the message box to pop up
(4) Open
(5) Association
Not to be continued.
Go WEB Usage Tools