Skip to content

开发软件配置.md

Latest commit

 

History

History
197 lines (162 loc) · 5.68 KB

开发软件配置.md

File metadata and controls

197 lines (162 loc) · 5.68 KB

常用便捷软件

Sublime Text

// 配置版本
{
    "browsers": ["last 5 versions", "android 2.2"]
    // "browsers": ["last 5 versions"]
}

// 配置快捷键
{ "keys": ["ctrl+alt+shift+p"], "command": "autoprefixer" }
    //chorme
    {
        "keys": ["f5"],
        "command": "side_bar_files_open_with",
        "args": {
            "paths": [],
            "application": "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe",
            "extensions": ".*"
        }
    }
    {
        "keys": ["ctrl+f5"], "command": "browser_refresh", "args": {
            "auto_save": true,
            "delay": 0.0,
            "activate": true,
            "browsers" : ["chrome"]
        }
    }
    // 配置MarkdownEditing主题颜色和可视区域
    // Preferences>Package Settings>Markdown Editing>Markdown GFM Settings-User
    {
        "color_scheme": "Packages/MarkdownEditing/MarkdownEditor-Dark.tmTheme",
        "wrap_width": 800
    }

    // preview预览
    // Preferences>Package Settings>Markdown Preview>Settings-User
    {
        "browser" : "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe"
    }
    // Preferences>Key Bindings-User
    { "keys": ["f2"], "command": "markdown_preview", "args":   {"target": "browser", "parser":"markdown"} }
    \$('.load_box p').text(Math.floor(percent * 100)+'%');
    \$('.load_box .in').css('width',Math.floor(percent * 100)+'%');

sublime 提升开发效率

  1. 主题界面
  • Preferences>Setting-User
{
    "afn_template_languages": true,
    "afn_valid_scopes":
    [
        "string",
        "css",
        "sass",
        "less",
        "scss",
        "shtml",
        "html",
        "inc"
    ],
    "color_scheme": "Packages/Theme - Afterglow/Afterglow.tmTheme",
    "font_face": "Consolas Italic",
    "font_size": 11,
    "ignored_packages":
    [
        "Markdown",
        "Vintage"
    ],
    "line_padding_bottom": 3,
    "line_padding_top": 3,
    "status_bar_brighter": true,
    "tab_size": 4,
    "tabs_medium": true,
    "theme": "Afterglow-orange.sublime-theme",
    "update_check": false
}
  1. 插件推荐-截图

插件

  1. new Snippet

Fiddler-抓包分析

使用场景

  • 开发环境配置
  • 后端接口调试
  • 线上 bugfix
    • 将线上文件代理到本地,快速定位 bug
    • 如线上有数据，但是本地没数据，出现 bug，可将线上 js 映射到本地进行调试修改
  • 性能分析和优化

面板说明

  • Replay:键盘快捷键 R
  • Go:调试 Debug
  • Stream:模式切换
  • Decode:解压请求
  • Keep:保持会话
  • Any Process:过滤请求
  • Capturing:控制 fiddler 是否工作
  • Inspectors:解包
  • AutoResponder:文件代理
  • Composer:前后端接口联调

WAMP

  • 参见

  • 配置-wamp 支持 inc

    Apache 支持 include 文件解析 shtml 首先要应该修改 Apache 配置文件 httpd.conf

    wamp64\bin\apache\apache2.4.23\conf Apache 默认是不支持 SSI 的，需要我们更改 httpd.conf 来进行配置。我这里以 windows 平台的 Apache 2.0.x 为例，打开 conf 目录下的 httpd.conf 文件，搜索“AddType text/html .shtml”，搜索结果： # AddType text/html .shtml # AddOutputFilter INCLUDES .shtml 把这两行前面的#去掉。

    然后搜索“Options Indexes FollowSymLinks” 在搜索到的那一行后面添加“ Includes” 即将该行改变为 Options Indexes FollowSymLinks Includes

    保存 httpd.conf，重起 apache 即可。

跨域 chrome 插件

  • Access-Control-Allow-Origin
  • 插件 
let url = '//api-m.mtime.cn/Showtime/HotCitiesByCinema.api'
$.ajax({
  url,
  type: 'GET',
  dataType: 'json'
})
  .done(res => {
    console.log('success', res)
  })
  .fail(() => {
    console.log('error')
  })