脚本宝典收集整理的这篇文章主要介绍了

3秒钟快速搭建一个react多页应用

脚本宝典小编觉得挺不错的,现在分享给大家,也给大家做个参考,希望能帮助你少写一行代码,多一份安全和惬意。

what

本文主要阐述了如何使用dawn快速搭建一个多页面应用。

why

单页有许多优缺点。而我司当前的情况比较适合于使用多页面应用,既提高了开发效率,保证了用户体验,又极大的兼容了原有的PHP体系。

how

  1. 第一秒,准备原材料

    $ npm install dawn -g
    $ mkdir demo
  2. 第二秒,初始化应用

    // react
    $ dn init -t react
  3. 第三秒,多页配置
    ./src中,复制并修改index.js为所需的页面名称。当然也可以不复制不修改,此时就是一个单页面应用。dawn会自动读取./src中的js作为入口(不包括子目录中的js

至此,多页面应用已经构建完成

extra

在此基础上,我又进行了一些额外配置

  • 状态管理方案参考了这篇 利用Dawn工程化工具实践MobX数据流管理方案,或者可以说因为这篇文章对于Mobx的优秀实践,我发现了dawn这个工具
  • webpack进行高度配置,在./下新建webpack.config.js。举个例子:

    module.exports = function(configs,webpack,ctx){
      //configs 为默认配置,可以在这里对其进行修改
      //webpack 当前 webpack 实例
      //ctx 当前构建「上下文实例」
      configs.plugins.push(new webpack.DefinePlugin({
        "process.env": { 
           NODE_ENV: JSON.stringify("production") 
         }
      }));
    };
  • 将入口文件移入新建./src下的pages文件夹,同时在./.dawn/pipe.yml中修改devbuild下的webpack

    entry: ./src/pages/*.js
  • 修改./src/assets/*.html增加业务所需内容

总结

以上是脚本宝典为你收集整理的

3秒钟快速搭建一个react多页应用

全部内容,希望文章能够帮你解决

3秒钟快速搭建一个react多页应用

所遇到的程序开发问题,欢迎加入QQ群277859234一起讨论学习。如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典网站推荐给程序员好友。 本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。

80%的人都看过