1

我有使用Angular 材料的 Angular 项目。由于性能问题，我决定React使用ngReact 指令集成到我的项目中。所以一切正常。顺便说一句，我安装了 react withbower而不是npm.

所以现在我正在尝试集成React Material UI，以便能够在 React 中使用诸如下拉菜单之类的 Material 组件，而不是在 Angular 材质中使用md-select 。

今天我用命令编译 reactjsx文件jsx，比如：

jsx -w -x jsx app/scripts/components/  app/scripts/components/build/

到目前为止，一切都很好。

React Material UI 没有，bower但是npm. 所以我安装material-ui了接下来呢？

如何使用反应组件？我需要一些js文件将其包含到我的index.html.

当我尝试包含时node_modules/material-ui/index.js，出现错误：

index.js:3 未捕获的 ReferenceError：未定义导出

这是一个index.js内容：

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.ToolbarTitle = exports.ToolbarSeparator = exports.ToolbarGroup = exports.Toolbar = exports.Toggle = exports.TimePicker = exports.TextField = exports.TableRowColumn = exports.TableRow = exports.TableHeaderColumn = exports.TableHeader = exports.TableFooter = exports.TableBody = exports.Table = exports.Tab = exports.Tabs = exports.Snackbar = exports.Stepper = exports.StepLabel = exports.StepContent = exports.StepButton = exports.Step = exports.SvgIcon = exports.Subheader = exports.Slider = exports.SelectField = exports.RefreshIndicator = exports.RaisedButton = exports.RadioButtonGroup = exports.RadioButton = exports.Popover = exports.Paper = exports.MenuItem = exports.Menu = exports.MakeSelectable = exports.ListItem = exports.List = exports.LinearProgress = exports.IconMenu = exports.IconButton = exports.GridTile = exports.GridList = exports.FontIcon = exports.FloatingActionButton = exports.FlatButton = exports.DropDownMenu = exports.Drawer = exports.Divider = exports.Dialog = exports.DatePicker = exports.CircularProgress = exports.Checkbox = exports.CardText = exports.CardTitle = exports.CardMedia = exports.CardHeader = exports.CardActions = exports.Card = exports.Badge = exports.Avatar = exports.AutoComplete = exports.AppBar = undefined;

var _AppBar2 = require('./AppBar');

var _AppBar3 = _interopRequireDefault(_AppBar2);

// ....   


var _ToolbarTitle3 = _interopRequireDefault(_ToolbarTitle2);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

exports.AppBar = _AppBar3.default;
exports.AutoComplete = _AutoComplete3.default;
exports.Avatar = _Avatar3.default;
exports.Badge = _Badge3.default;

  //....

exports.ToolbarSeparator = _ToolbarSeparator3.default;
exports.ToolbarTitle = _ToolbarTitle3.default;

有没有人解决/使用这种方法？

4

0 回答 0