一、前言: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. VS2015 类模板保存位置

    如果安装在C盘,则是如下位置: C:\Program Files (x86)\Microsoft Visual Studio 14.0\Common7\IDE\ItemTemplates\CSharp ...

  2. 做JAVA开发的同学一定遇到过的爆表问题,看这里解决

    欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由净地发表于云+社区专栏 记一次Java线上服务器CPU过载问题的排查过程,详解排查过程中用到的Java性能监测工具:jvisualvm ...

  3. ASP.NET MVC下使用AngularJs语言(九):日期时间处理与显示

    当在angularjs去显示一个时间时,如原原本本去显示这个值,它将显示一个怪怪的字符串,其实它就是被系列化json之后的字符串.如:一个空值显示为日期时间: 如果非空值显示为日期时间的情形: 为了能 ...

  4. 使用PostgreSQL进行中文全文检索

    code[class*="language-"], pre[class*="language-"] { background-color: #fdfdfd; - ...

  5. c# 遍历所有安装程序 获取所有已经安装的程序

    /// <summary> /// 获取所有已经安装的程序 /// </summary> /// <param name="reg"></ ...

  6. Java 代码需要使用转义符的地方

    1.正则表达式特殊字符 Java 代码中使用到正则表达式里的特殊字符需要使用转义符 \ 进行转义 . ? * + ! ^ $ [ ] ( ) \ 因为反斜线 \ 也是特殊字符,所以转义需双反斜线 \\ ...

  7. java后端导入excel模板和导入excel文件去读数据

    模板转载地址:https://www.cnblogs.com/zhangyangtao/p/9802948.html 直接上代码(我是基于ssm写的demo,导入文件目前只能读取.xls后缀的exce ...

  8. 脚手架vue-cli系列一:安装与规范

    我很喜欢Vue的一个重要原因就是因为它的vue-cli,这个工具可以让一个简单的命令行工具来帮助我快速地构建一个足以支撑实际项目开发的Vue环境,并不像Angular和React那样要在Yoman上找 ...

  9. 【PaddlePaddle】自然语言处理:句词预测

    前言 预测词汇的相关性算是自然语言中的HelloWolrd.本文主要根据百度PaddlePaddle示例word2vec,对句子中下一个单词的预测.该示例使用4个词语来预测下一个词. 1. 数据集以及 ...

  10. Spring Data Redis示例

    说明 关于Redis:一个基于键值对存储的NoSQL内存数据库,可存储复杂的数据结构,如List, Set, Hashes. 关于Spring Data Redis:简称SDR, 能让Spring应用 ...