Windows系统零开始前端开发环境配置
1. 安装nodejs
国内下载页面(推荐)
官网下载页面
现在的nodejs自带NPM,只需点击下一步下一步安装即可。
为了加速国内NPM包下载,可配置淘宝NPM镜像
2. 安装git
国内下载页面(推荐)
官网下载页面
国内直接从官网下载比较困难,需要翻墙。
所以这里要感谢淘宝NPM镜像提供空间。
3. 安装VSCode和常用插件
官网下载页面
下面是常用的插件列表:
Git History
Git Lens
Babel ES6/ES7
ESLint
EditorConfig for Visual Studio Code
以上插件用于优化编辑器里进行git管理,代码规范化的体验。
4. 优化VSCode编辑器默认行为
在项目目录下新建.editorconfig文件。
包括统一tab的占位,保存文件时最后一行再插入新行,去除首尾空格。
# 配置文件内容
# editorconfig.org
root = true
[*]
charset = utf-8
end_of_line = lf
indent_size = 2
indent_style = space
insert_final_newline = true
trim_trailing_whitespace = true
[*.md]
trim_trailing_whitespace = false
5. 配置VSCode编辑器代码规范
安装airbnb的规范
npm install -g eslint-config-airbnb eslint-plugin-import eslint-plugin-react eslint-plugin-jsx-a11y babel-eslint在项目目录下新建.eslintrc文件
{ "extends": "airbnb", "parser": "babel-eslint", "env": { "browser": true, "node": true, "mocha": true }, "globals": { "Babel": true, "React": true }, "plugins": [
"react"
], "rules": { "global-require": "off", "import/no-unresolved": "off", "no-underscore-dangle": "off", "no-new-func": "off", "no-param-reassign": "off", "react/prefer-stateless-function": "off", "react/no-multi-comp": "off", "react/jsx-no-bind": "off", "react/jsx-indent": "off", "react/jsx-first-prop-new-line": "off", "react/jsx-filename-extension": "off", "no-restricted-syntax": "off" }}
- 不是所有文件都需要eslint来校验格式
http://eslint.org/docs/user-guide/configuring
.eslintignore
**/dist/**
**/src/**
**/examples/**
**/node_modules/**
**/server.js
**/webpack.config*.js
Windows系统零开始前端开发环境配置的更多相关文章
- Windows系统上搭建Clickhouse开发环境
Windows系统上搭建Clickhouse开发环境 总体思路 微软的开发IDE是很棒的,有两种:Visual Studio 和 VS Code,一个重量级,一个轻量级.近年来VS Code越来越受欢 ...
- AngularJS + CoffeeScript 前端开发环境配置详解
AngularJS 号称 '第一框架' ('The first framework') 确实是名不虚传.由其从jQuery中完全转入AngularJS后就有无法离开他的感觉了.虽然AngularJS的 ...
- windows系统下简单nodej.s环境配置 安装
国内目前关注最高,维护最好的一个关于nodejs的网站应该是http://www.cnodejs.org/ windows系统下简单nodejs环境配置. 第一步:下载安装文件 下载地址:官网 htt ...
- windows下vue+webpack前端开发环境搭建及nginx部署
一.开发环境搭建 1.前端框架一般都依赖nodejs,我们首先要安装node.js.请参考http://www.cnblogs.com/wuac/p/6381819.html. 2.由于许多npm的源 ...
- windows系统下简单node.js环境配置 安装
国内目前关注最高,维护最好的一个关于nodejs的网站应该是http://www.cnodejs.org/ windows系统下简单nodejs环境配置. 第一步:下载安装文件 下载地址:官网 htt ...
- windows系统JDK的安装及环境配置
本文转载至:http://blog.csdn.net/sweetburden2011/article/details/8881181 一:JDK的安装 1. 首先上甲骨文公司的官方网站下载JDK的 ...
- Windows系统中 JDK安装及环境配置
需要安装jdk的第一步就是先去官网下载好JDK,选择需要的版本. Windows系统 1.将下载好的压缩包解压,点击解压得到的jdk执行文件开始安装.在安装过程中会弹出两个安装,一个是jdk,一个是j ...
- Sublime Text前端开发环境配置
Sublime Text是前端开发不可不说的编辑器,本文以Sublime Text 3为例讲解一下如何搭建前端的开发环境. 下载Sublime Text 3 下载地址 #==> Sublime ...
- windows下前端开发环境配置
nvm安装 多媒体布局 前端自动化构建工具,gulp nvm管理node的版本,npm是node的包管理工具 下载nvm安装包 https://github.com/coreybutler/nvm-w ...
随机推荐
- c# Applicatcontext类
Application类(位于System.Windows.Forms命名空间)公开了Run方法,可以调用该方法来调度应用程序进入消息循环.Run方法有三个重载 1.第一个重载版本不带任何参数,比较少 ...
- JDK8 元空间
1. 运行时常量池和静态变量都存储到了堆中,MetaSpace存储类的元数据,MetaSpace直接申请在本地内存中(Native memory),这样类的元数据分配只受本地内存大小的限制,OOM问题 ...
- android搜索框列表布局,流程及主要步骤思维导图
android搜索框列表布局,流程及主要步骤思维导图 android搜索框列表布局,流程及主要步骤思维导图 activity_coin_search.xml----------<com.scwa ...
- 浅析PAC,修改PAC文件及user-rule文件实现自动代理
浅析PAC,修改PAC文件及user-rule文件实现自动代理 代理自动配置(英语:Proxy auto-config,简称PAC)是一种网页浏览器技术,用于定义浏览器该如何自动选择适当的代理服务器来 ...
- pyspider操作千万级库,pyspider在对接量级较大库的策略
pyspider操作千万级库,pyspider在对接量级较大库的策略 如果是需要pyspider正常的流程去执行,那必然是会在on_strat()时任务执行超时,可能只读取出几万条或十几万条数据就会被 ...
- Unable to open socket file: target process not responding or HotSpot VM not loaded
Unable to open socket file: target process not responding or HotSpot VM not loaded The -F option can ...
- bzoj3678 简单题
题目链接 bitset #include<algorithm> #include<iostream> #include<cstdlib> #include<c ...
- ES6知识整理(6)--Symbol函数
(文章会同步到博客园,技术类文章还是该让搜索引擎察觉比较好) symbol是js的第7种数据类型: 7种分别是:undefined.null.boolean(布尔).string(字符串).numbe ...
- right spindle supply short to gnd-- compact version
hardware guy found that the R1004 lead to this error, but this error should not be checked, because ...
- pyqt5 树节点点击实现多窗口切换
# coding=utf-8 import sys from PyQt5.QtWidgets import * from PyQt5.QtCore import * from PyQt5.QtGui ...