前端工具:

      sublime text3  

SRE实战 互联网时代守护先锋,助力企业售后服务体系运筹帷幄!一键直达领取阿里云限量特价优惠。

                 下载:https://www.sublimetext.com/3

                  中文版设置:https://jingyan.baidu.com/article/9c69d48fea00ca13c9024e18.html

                  修改插件包位置:https://www.cnblogs.com/xiterjia/p/5745826.html

                  如何安装插件?ctrl+shift+p -> 输入install package -> 输入相关插件名

                  以下插件,未说明使用方法的均安装即用

                                   1. HTML/CSS/JS Prettify 

                                       前端代码快速格式 快捷键 ctrl+shift+h

                                       需要环境node.js 下载:https://nodejs.org/en/ 

                                       修改“node_path”中相关操作系统路径

                                   2.Emmet 代码提示

                                   3.Side​Bar​Enhancements

                                      文件-》打开文件夹  左侧会出现文件列表

                                      本工具用于增强文件列表鼠标右键可选功能

                                   4.sublime server  开启本地服务器调试

                                      当从别的页面调取信息时,需要开启本地服务器,不然jQuery会报错

                                      使用方法:打开Go Web 使用工具 go 第1张->SublimeServer->startSublimeServer->在选择html,

                                                     点击鼠标右键,选择View in SublimeServer   

                                      注:待调试html需要位于右侧文件列表中,如图         

                                                                                                               Go Web 使用工具 go 第2张

                                   5.谷歌浏览器增强插件

                                      确保能访问谷歌网上商店:

                                           https://chrome.google.com/webstore/category/extensions?hl=zh-CN

                                      若不能,下载谷歌访问助手:http://www.ggfwzs.com/

                                      谷歌访问助手安装方法:

                                                     (1)打开谷歌浏览器,打开Go Web 使用工具 go 第3张

                                                     (2)更多工具->扩展工具

                                                     (3)将下载好的谷歌访问助手拖动到扩展工具页面中,进行安装

                                      5-1.LiveReload 

                                            用于 在sublime 修改代码 保存的同时 改变 谷歌浏览器的页面信息

                                                     (1)打开谷歌网上商店,安装LiveReload插件

                                                     (2)在谷歌扩展程序界面,找到相关插件,点击详细信息,找到

                                                          打开   Go Web 使用工具 go 第4张

                                                     (3)在sublime中安装插件LiveReload

                                           使用方法:

                                                     (1)ctrl+shift+p

                                                     (2)打开Go Web 使用工具 go 第5张

                                                     (3)打开Go Web 使用工具 go 第6张

                                                     (4)启动sublime server(非必须)

                                                     (5)打开需要访问的*.html 文件,右键选择View in SublimeServer

                                                     (6)Go Web 使用工具 go 第7张 ->Go Web 使用工具 go 第8张

                                      5-2.LiveStyle

                                            用于谷歌浏览器和sublime中CSS 的双向交互,在一方改变CSS代码的值

                                            另一方也会同时发生改变,即实时更新                                                 

                                                    (1)打开谷歌网上商店,安装LiveStyle(Emmet LiveStyle)插件

                                                    (2)在谷歌扩展程序界面,找到相关插件,点击详细信息,找到

                                                         打开 Go Web 使用工具 go 第9张

                                                    (3)在sublime中安装插件LiveStyle

                                            使用方法

                                                     (1)用sublime打开*.html文件和待关联的*./css文件

                                                     (2)点击右键SublimeServer方式打开(非必须)

                                                     (3)点击Go Web 使用工具 go 第10张,等待信息框弹出

                                                     (4)打开Go Web 使用工具 go 第11张

                                                     (5)关联Go Web 使用工具 go 第12张

                                      

 Go语言工具

                   因为网上前辈已经写得很详细,就不多在此进行赘述,引用下链接

                   LiteIDE :https://blog.csdn.net/defonds/article/details/50544208

 

 

 

 

 

 

 

 

 

 

 

                                       

 

扫码关注我们
微信号:SRE实战
拒绝背锅 运筹帷幄