前端project师养成记:开发环境搭建(Sublime Text必备插件推荐)
为了让自己更像一个前端project师,决定从开发环境開始武装自己。
本文将介绍前段project师开发的一些利器的安装步骤,主要包含了:
1.Node.js的安装
2.Grunt的安装及经常使用插件
3.Sublime Text的安装及必备插件
一.Node.js的安装
Node.js就是一堆前端project师捧红的,所以装上这个嘛,主要不是自己须要使用Node.js而是一堆工具对他的依赖。
Windows下安装步骤非常easy:
1.去到http://nodejs.org/下载最新的安装包,安装。
2.在CMD下执行。node和npm看看是否能执行成功,假设不行就检查下PATH的设置。
3.有个很好用的东西值得全局安装anywhere,能够在不论什么文件夹启动一个web服务,手机调试页面必备。
二.Grunt的安装
Grunt是眼下用的比較多的构建工具,写Java的都知道Maven,这玩意儿就是Javascript界的Maven。
里面有各种插件很有用。
1.在CMD下执行:npm install -g grunt-cli
2.试下能不能在CMD下执行:grunt。可能会报错,没关系由于没有配置文件。
正常的一个项目构建的流程一般是先在代码根文件夹以下。创建了package.json和Gruntfile.js,之后先执行npm install然后再执行grunt就能够完毕项目的构建了。
以下介绍一些前端经常使用的Grunt插件:
grunt-cli 这个就是命令行
grunt-contrib-clean 这个用于build前的清理工作
grunt-contrib-concat 这个用于拼接文件
grunt-contrib-copy 这个用于复制文件
grunt-contrib-cssmin 这个用于压缩css
grunt-contrib-uglify 这个用于压缩js
grunt-contrib-htmlmin 这个用于压缩html
能够看下我的开源项目Tiny-Alert基本上展示了一个最简单的配置。https://coding.net/u/shootyou/p/Tiny-Alert/git
三.Sublime Text的安装及必备插件
没用Sublime之前以为这黑不拉几的玩意儿有啥好玩的。自己用了才知道,这玩意儿真不是用来装逼的,用熟了至少提高前端project师一倍的效率,写程序那叫一个快。
1.安装Sublime Text 3: http://www.sublimetext.com/3
2.破解什么的自行补脑
3.安装package control
import urllib.request,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read())
打开sublime text 3。按ctrl+`或者菜单View > Show Console打开命令窗体,粘贴以上代码并回车就可以。
然后就開始幸福生活了,Ctrl+Shift+P唤起。这个玩意儿是万能的,你想要啥都在这输入下即可了。输入:Install,选择Install Package,然后输入以下插件的名字搜索即可了。
必备插件:
AutoFileName:自己主动补全文件名称
Emmet:神器啊,花10分钟学学语法,让你提升10倍编码速度:http://blog.wpjam.com/m/emmet-grammar/
Go-To-Css-Declaration:跳转到css的定义处
JsFormat:格式化js代码
Tag:貌似是能够补全和格式化html标签
Themr:主题选择
Autoprefixer:自己主动加入浏览器兼容前缀
CodeFormatter:代码格式化
ConvertToUTF8:解决中文编码问题
SublimeLinter:代码提示高亮
Terminal:唤起终端控制台
前端project师养成记:开发环境搭建(Sublime Text必备插件推荐)相关推荐
- 【技术文档】Jeecg-P3开发环境搭建入门(java插件开发框架)
一.项目工程说明 jeecg-p3-web | 启动主项目 jeecg-p3-biz-demo | 插件项目 注意:项目为maven工程,采用maven方式导入eclipse等ID ...
- GO语言环境搭建 + Sublime text 3 + Git + MarGo + gocode 组合配置详解
1.window下安装go google有提供win安装包,对于新手还是非常简单的! https://code.google.com/p/go/downloads/list:环境变量已经配置好我们只需 ...
- Ubuntu 配置 Go 语言开发环境(Sublime Text+GoSublime)
本文针对的 Go 语言版本为 1.3,之前也有相关文章讲解如何在 Ubuntu 下配置Go语言的开发环境,但时过境迁,一些方法已经不相同或者不必要.虽讲的是 Ubuntu 下安装配置过程,但 Wind ...
- golang开发环境之Sublime Text 2+GoSublime+gocode+MarGo
Sublime Text 2(以下简称Sublime)+GoSublime+gocode+MarGo的组合 优点:1.自动提示,2.保存的时候自动格式化代码,3支持项目管理,4.语法高亮 下载Subl ...
- 启明云端分享|ESP32-S3开发环境搭建,这里我们会介绍两个比较常用的开发环境搭建:WINDOWS\LINUX
ESP32-S3开发环境搭建,这里我们会介绍两个比较常用的开发环境搭建:WINDOWS\LINUX 详细安装步骤概览 注:目前master分支,支持S3. 官方开发文档:包含多种平台 https:// ...
- QQ玩一玩(轻游戏)开发环境搭建与调试
玩一玩开发环境搭建与调试 前言 Android 调试 下载Android Studio 配置环境变量 进入用户当前目录 设置环境变量 设置生效 检查配置是否正常 下载特殊版测试Q 调试时Android ...
- dashboard windows 前端开发环境搭建
dashboard是kubernetes的云管平台UI界面,正常情况下,其是在linux下开发的,但是,有些特殊情况下,我们也可能希望在windows上搭建起dashboard的开发环境 这里我们将搭 ...
- Linner和WebStorm前端开发环境搭建
Linner和WebStorm前端开发环境搭建 注意: 1. Jdk1.6以上 2. 数据库推荐用MySQL 以下是前端工厂开发环境搭建,主要用到Lin ...
- Web前端开发环境搭建
最近在学习前端开发,通过网上的查找资料和自身实践:完成了前端开发环境的简单搭建.但发现网上提供的搭建方法总有些不全,因此把自己的搭建过程分享一下,希望能为web开发入门者提供帮助,少走弯路. 搭建的环 ...
最新文章
- squid一些其它配置
- hdu 2433 Travel
- 由浅入深之Jq选择器(2)
- mybatis分页插件pageHelper简单实用
- Python除了不会生孩子,什么都会
- python降序排列说true不存在_【图片】Python3萌新入门笔记(8)【python吧】_百度贴吧...
- Android 使用 DownloadManager 管理系统下载任务的方法,android管理系统
- Android 系统源码——下载到编译
- python爬虫常用模块介绍_python爬虫常用的模块分析
- echart 自适应屏幕大小
- Python怼人代码,让编程变得更有趣
- 跨部门工作安排与绩效考评解决方案
- Linux ssh无密登陆
- 29. 大数据---hive的常用函数(一(最全的函数操作))
- 为什么现在用的otm8018b型LCD屏的ID不能被读取?
- WPH4003-1E 1700V3A N沟道 功率MOSFET 低损耗实现高效率
- pck_nbs_runstats脚本
- 手把手教你做项目MySQL篇——从下载到命令总结
- 百度定位后,微信小程序位置不准,怎么办 腾讯/百度地图经纬度相互转换
- 【C语言/C++】项目实战:猜拳游戏(源码详解)
热门文章
- java f.add()_f.add(p1,First); 那个“First”是什么意思呀?
- 第15天学习Java的笔记(封装性,this,构造方法)
- FPGA是如何搭建的
- 北斗导航 | 多GNSS系统PPP-RTK原型系统及性能分析(2020 CPGPS全球华人导航定位协会年会)
- Qt学习(四):qt读写文件
- socket缓冲区以及阻塞模式详解
- 可靠性不是测试出来的,是设计出来的!
- 如何在C++中将filetime时间转化为字符串?
- keil查看程序运行时间_Keil系列教程05_工程目标选项配置(一)
- json支持的最大长度_Swifter.Json 可能是 .Net 平台迄今为止性能最佳的 Json 序列化库【开源】...