一、前言：react的cli开发模式太过于简单，好多东西都要自己配置

二、这里有个简单的配置，可以直接上手开发(不熟悉webpack和npm的绕路)，已经完成的配置如下

1：默认ejs模板

2：编译less、scss

3：热更新

4：抽离压缩CSS、js

5：打包后chunkhash模式的版本号

6：提取公用第三方JS库

7：图片base64处理

8：本机IP地址打开，便于手机测试

9：proxy本地代理配置，方便跨域测试接口

三：会不断更新，欢迎clone使用，源码戳这里

四、其他：2017-9月底babel官方关于babel-preset-es2015已经废弃，替换为babel-preset-env，

对应的.babelrc内

该仓库已经更新

基于webpack的react脚手架的更多相关文章

  1. 基于webpack的react开发环境搭建新手教程

    最近学习react-webpack项目搭建,找到一篇我认为不错的博客,跟着学习了一番,写得很详细很好,本篇博客纯属记录总结,要看更详细的搭建过程及解析,请戳: 基于webpack的React项目搭建( ...

  2. 基于webpack的React项目搭建(一)

    前言 工欲善其事,必先利其器.为了更好的学习React,我们先简要的把开发环境搭建起来.本文主要介绍使用webpack搭建React项目,如果你对React或es6的基础语法还不了解,建议先去学习学习 ...

  3. 基于webpack的React项目搭建(三)

    前言 搭建好前文的开发环境,已经可以进行开发.然而实际的项目中,不同环境有着不同的构建需求.这里就将开发环境和生产环境的配置单独提取出来,并做一些简单的优化. 分离不同环境公有配置 不同环境虽然有不同 ...

  4. 基于webpack的React项目搭建(二)

    前言 前面我们已经搭建了基础环境,现在将开发环境更完善一些. devtool 在开发的过程,我们会经常调试,so,为了方便我们在chrome中调试源代码,需要更改webpack.config.js,然 ...

  5. webpack 配置react脚手架（六）：api

    1 访问网址 https://cnodejs.org/api 可以调取api 2.//该body-parser 可以将请求的body数据,转变成 json 格式数据://express-session ...

  6. webpack 配置react脚手架（三）：eslint 及优化

    首先谨记 eslint的官网:  http://eslint.cn/ 1 安装eslint  npm i eslint -D 2.在根目录下新建文件 .eslintrc { "extends ...

  7. webpack 配置react脚手架（二）：热更新

    下面继续配置 webpack dev server    hot module replacement: 首先配置dev-server     安装     npm i webpack-dev-ser ...

  8. webpack 配置react脚手架

    1 react 基本js文件: import React from 'react'; import ReactDOM from 'react-dom'; import App from './App. ...

  9. 【转载】基于webpack构建react项目

    第一部分链接:下载所需内容并构建基础的页面 第二部分链接:添加webpack中的一些常用babel和loader 第三部分链接:开发环境与生产环境的配置

随机推荐

  1. CMD指令及其意义

    1. appwiz.cpl:程序和功能 2. calc:启动计算器 5. chkdsk.exe:Chkdsk磁盘检查(管理员身份运行命令提示符) 6. cleanmgr: 打开磁盘清理工具 9. cm ...

  2. EF db first 获取表名称

    一直以来,使用DB FIRST的方式,想得到表名,最后一直不得其法.直到昨天晚上,反编译自己的程序集的时候,突然发现EF表结构和数据实体类的映射关系存在什么地方.然后就有了这篇文章. 咱们一步步来. ...

  3. C#自定义异常 统一异常处理

    异常类 using System; using System.Collections.Generic; using System.Linq; using System.Text; using Syst ...

  4. 【转】学习Java虚拟机没用？ 听听当事人是怎么说的！

    我是大名鼎鼎的Java 虚拟机,  据说这个星球上每天有900多万程序员和我打交道,这真是一个惊人的数字. 这900多万人中不少人对我的技术内幕非常感兴趣, 有事儿没事儿都要把我“大卸八块”, 深入了 ...

  5. React.js 三周 -- 入门到搭建团队基础项目

    吐槽 公司自己的产品,由于历史遗留问题,前端一直是和java放到一个项目里写的. 导致了,前端就被死死的绑在了IDEA战车上.想要看页面效果,先起几个java服务.想要调试一个改动,重启个java服务 ...

  6. Using SQLite database in your Windows 10 apps

    MVP可以在channel 9上传视频了,所以准备做个英文视频传上去分享给大家,本文做稿子. Hello everyone, As we all know, SQLite is a great and ...

  7. 转载 12步轻松搞定python装饰器

    作者: TypingQuietly 原文链接: https://www.jianshu.com/p/d68c6da1587a 呵呵!作为一名教python的老师,我发现学生们基本上一开始很难搞定pyt ...

  8. EasyNetQ中使用自定义的ISerializer

    最近在使用EasyNetQ时,遇到一个问题:c++项目组发送的消息数据不是Json数据,而是自定义的数据格式(各字段+‘|’连接成一个字符串),EasyNetQ中消费消息接收的都是强类型,没办法直接消 ...

  9. 自动化测试 | UI Automator 入门指南

    自动化测试的定义,这里先引用一段维基百科的定义: 在软件测试中,测试自动化(英语:Test automation)是一种测试方法,使用特定的软件,去控制测试流程,并比较实际的结果与预期结果之间的差异. ...

  10. CSS 基础：文本和字体(4)<思维导图>

    这段时间利用一下间隙时间学习了CSS的基础知识,主要目的是加深对CSS的理解,虽然个人主要工作基本都是后台开发,但是个人觉得系统学习一下CSS的基础还是很有必要的.下面我学习CSS时做的思维导图(全屏 ...