不使用webpack工具做react项目

1.引入react相关js文件

<script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script>
<script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script>
<script src="https://cdn.staticfile.org/babel-standalone/6.26.0/babel.min.js"></script>

2.引入jsx文件组件并使用

<script type="text/babel" src="./js/demo.jsx"></script>
<script type="text/babel">
ReactDOM.render( < MyComponent />,
document.getElementById('App')
);
</script>

3. 备注

在jsx文件中定义组件内容

如何在html中引入jsx文件的更多相关文章

  1. IOS开发问题录:如何在Swift中引入Head文件?

    最近在学习IOS开发,从一个简单的登录开始,逐步解决了一个网络访问.获取控件值等问题,遇到了信息加密的问题. 做为IOS的入门者,信息加密需要解决如下几个问题: 1.IOS的MD5加密有没有固定函数, ...

  2. 如何在jsp中引入bootstrap

    如何在jsp中引入bootstrap包: 1.首先在http://getbootstrap.com/上下载Bootstrap的最新版. 您会看到两个按钮: Download Bootstrap:下载 ...

  3. 『vue踩坑日常』 在index.html中引入静态文件不生效

    Vue日常踩坑日常 -- 在index.html中引入静态文件不生效问题 本文针对的是Vue小白,不喜勿喷,谢谢 出现该问题的标志如下 控制台warning(Resource interpreted ...

  4. 如何在idea中引入一个新maven项目

    如何在idea中引入一个新的maven项目,请参见如下操作:      

  5. 【jsp】怎么在jsp文件中引入静态文件(.js .css)

    如果在jsp文件中引入静态文件比如(.js或.css等等),可以在使用 /项目名称/路径 的方式,但是这种方式如果在修改了项目了名称后就显得比较麻烦了.除了之外还许多方式,比如相对路径等等.一般情况下 ...

  6. 如何在xampp中运行php文件 (WINDOWS)

    from:http://blog.sina.com.cn/s/blog_5e87822501011os2.html 入门: 如何在xampp中运行php文件 (WINDOWS) 安装XAMPP启动ap ...

  7. Spring依赖注入的方式、类型、Bean的作用域、自动注入、在Spring配置文件中引入属性文件

    1.Spring依赖注入的方式 通过set方法完成依赖注入 通过构造方法完成依赖注入 2.依赖注入的类型 基本数据类型和字符串 使用value属性 如果是指向另一个对象的引入 使用ref属性 User ...

  8. 如何在C#中引入CPLEX的dll(CPLEX系列-教程一)

    以前写在CSDN上的文章.转到博客园之后,打算把这个教程移过来,顺便完善后面的教程.主要是在Asp.Net+EF6里面使用cplex,完成一个最优生产计划的决策.当时在查找如何在C#中引用cplex时 ...

  9. 如何在VC++ 中调试MEX文件

    MEX文件对应的是将C/C++文件语言的编写之后 得到的相关文件加载到Matlab中运行的一种方式, 现对于Matlab 中的某些程序运行效率而言, C/C++ 代码某些算法的领域上面执行效率很高,若 ...

随机推荐

  1. EasyPusher安卓Android手机直播推送之RTSP流媒体协议流程

    EasyPusher移动端推送同我们平时用的RTSP直播推送流程一样,都是采用标准RTSP/RTP推送流程:ANNOUNCE->SETUP->PLAY->RTP/RTCP->T ...

  2. EasyDarwin开发的短视频拍摄、录制开源项目EasyVideoRecorder

    在前面的博客<EasyDarwin开发出类似于美拍.秒拍的短视频拍摄SDK:EasyVideoRecorder>和<美拍.秒拍中安卓.IOS短视频拍摄的一些关键技术>中我们简单 ...

  3. scrollify 全屏滚动插件

    使用 1.引入文件 <script src="js/jquery.min.js"> </script> <script src="js/jq ...

  4. LNK1112: module machine type 'x64' conflicts with target machine type 'X86'

    1 什么是“module machine type” 这个是当前工程要链接的静态库的target machine type. 2 什么是“target machine type” 这个是当前工程生成的 ...

  5. (linux)BSP板级支持包开发理解

    1. 概述 嵌入式系统由硬件环境.嵌入式操作系统和应用程序组成,硬件环境是操作系统和应用程序运行的硬件平台,它随应用的不同而有不同的要求.硬件平台的多样性是嵌入式系统的主要特点,如何使嵌入式操作系统在 ...

  6. hdu1052 田忌赛马 —— 贪心

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1052 错误代码: #include<stdio.h>//田忌赛马,错误版 #include ...

  7. haproxy官方配置文档地址

    http://cbonte.github.io/haproxy-dconv/1.6/configuration.html#4-option%20http-keep-alive

  8. HTML5 实现文件拖放上传

    1. [图片] 5375acf5gw1dusqsscfksj.jpg ​2. [代码][HTML]代码 <!DOCTYPE html><html lang="en" ...

  9. 【应用】图片翻转js

    图片翻转:图片随着鼠标指针划过进行替换 <img src="example.gif" onmouseover="this.src='exampleTwo.gif'& ...

  10. 使用openssl的aes各种加密算法

    #include <stdio.h> #include <string.h> #include <sys/types.h> #include <sys/sta ...