一、前言: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. zookeeper配置文件共享中心

    最近频繁的系统上线,每次打包都要把配置文件替换为正式环境的配置文件,虽然说就是复制粘贴的事,架不住文件杂乱,而且多. 期初的想法是有没有办法将配置文件与系统隔离开来,这样在更新时候,就只需要更新代码部 ...

  2. 通过用jQuery写一个页面,我学到了什么

    概述 前几天面试,hr发来一个测试文件,让我做做看.我一看,其实就是根据PSD需求写一个页面,再加上一些互动效果即可. 刚好我之前学了切图,jquery等知识还没练手过,于是高兴的答应了. 最后花了3 ...

  3. 修改hosts文件用来观看coursera视频

    52.84.246.90 d3c33hcgiwev3.cloudfront.net 52.84.246.252 d3c33hcgiwev3.cloudfront.net 52.84.246.144 d ...

  4. 机器学习技法笔记:05 Kernel Logistic Regression

    Roadmap Soft-Margin SVM as Regularized Model SVM versus Logistic Regression SVM for Soft Binary Clas ...

  5. centos7防火墙管理的变化

    当我们在centos7中输入service iptables status 查看系统的防火墙状态,会出现如下错误: 网上查阅才知道centos7的防火墙管理工具变了,原来的iptables已经不用了, ...

  6. mac的safari浏览器调试ios手机网页

    iOS 6给Safari带来了远程的Web检查器工具. 一.参考链接 ios开发者文档 safari开发者工具 remote debugging safari 二.设置iphone 设置 -> ...

  7. LeetCode:111_Minimum Depth of Binary Tree | 二叉树的最小深度 | Easy

    要求:此题正好和Maximum Depth of Binary Tree一题是相反的,即寻找二叉树的最小的深度值:从根节点到最近的叶子节点的距离. 结题思路:和找最大距离不同之处在于:找最小距离要注意 ...

  8. Python九九乘法表三种方案

    方法一: row = 1 # 定义起始行 while row <= 9: # 最大打印 9 行 col = 1 # 定义起始列 while col <= row: # 最大打印 row 列 ...

  9. C# 线程中使用delegate对控件进行操作

    如果在线程中想改变控件的值是不可以的,会报出以下错误. 那么,如何在线程中改变控件上的值呢?第一个想到的就是委托. 委托定义:委托是一个类,它定义了方法的类型,使得可以将方法当作另一个方法的参数来进行 ...

  10. 【DB2】Event monitor for locking

    Customer said, they got the following Errors in applications logs Caused by: financing.tools.hub.sha ...