接着之前发的问题,如果在普通html网页中引入React+antd,已经搞字了,代码如下可正常运行。
Antdbutton.js
ReactDOM.render(
Primary
Default
Dashed
Danger
, document.getElementById('message1'));
可以看到button.js中用antd加上组件的名字就可以调用了。
现的问题是我又想再测试下antd-mobile,结果失败了,我想当然的换成了,如果提示不存在antd-mobile,研究了半天终于找到一个办法,就修改antd-mobile.js将里面的antd-mobile换成了自己的一个不带横线的名字,如下:
原代码
/*!
*
* antd-mobile v2.1.8
*
* Copyright 2015-present, Alipay, Inc.
* All rights reserved.
*
*/
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory(require("react"), require("react-dom"));
else if(typeof define === 'function' && define.amd)
define(["react", "react-dom"], factory);
else if(typeof exports === 'object')
exports["antd-mobile"] = factory(require("react"), require("react-dom"));
else
root["antd-mobile"] = factory(root["React"], root["ReactDOM"]);
我改成了以下代码,将antd-mobile换成了m
/*!
*
* antd-mobile v2.1.8
*
* Copyright 2015-present, Alipay, Inc.
* All rights reserved.
*
*/
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory(require("react"), require("react-dom"));
else if(typeof define === 'function' && define.amd)
define(["react", "react-dom"], factory);
else if(typeof exports === 'object')
exports["m"] = factory(require("react"), require("react-dom"));
else
root["m"] = factory(root["React"], root["ReactDOM"]);
于是这样竟然可以用按钮这样引用了。
那么我的问题是如何不改变antd-mobile就可以正常引用!
附完整代码(下面的代码是报错无法正常运行的)
Antdbutton-m.js
ReactDOM.render(
primary
, document.getElementById('message1'));
回答
你这么用不划算的。还是用webapck这类构建工具吧