Merge branch 'master' of node/npmcomment into master

CHANGELOG.md

 # CHANGELOG
 
+## 1.0.0
+
+- [x] 完成通用评论国际化
+
 ## 0.6.0
 
 - [x] 添加pageType slice，用于截断评论，点击查看更多回调进行跳转
 
 ## 0.5.14
+
 - [x] 增加onDelete回调
 
 ## 0.5.13

README.md

 解决办法就是使用 [`fix/classname`](https://git.links123.net/node/npmcomment/src/branch/fix/classname) 分支中的静态文件：
 
 - [https://git.links123.net/node/npmcomment/src/branch/fix/classname](https://git.links123.net/node/npmcomment/src/branch/fix/classname)
+- static: [https://git.links123.net/node/npmcomment/src/branch/fix/classname/assets/static](https://git.links123.net/node/npmcomment/src/branch/fix/classname/assets/static)
+
+
+> 尝试过使用 CSS Module 进行修改，不过改造量较大，改动的过程中影响了其他样式，所以暂时放弃了。
 
-尝试过使用 CSS Module 进行修改，不过改造量较大，改动的过程中影响了其他样式，所以暂时放弃了。
 
 ## Comment
 
 | onGetMoreBtnClick      | function() |                                    | false    | 点击查看更多按钮的回调                            |
 | onPageChange     | function(page) |                                    | false    | 页码发生变化时的回调,注意:分页数据获取还是在组件内部处理的                            |
 | onDelete         | function(type) |                                    | false    | 评论或回复删除成功后的回调, type: "comment" \| "reply" , 用于区分删除的是评论还是回复 |
+| locales          | string         | 语言                                | false    | 语言，zh-CN/en-US。默认根据 url 中的 lang 参数来获取。所以一般情况可不传入       
 
 
 ## Editor

lib/App.js

 
 var _axios2 = _interopRequireDefault(_axios);
 
+var _reactIntlUniversal = require("react-intl-universal");
+
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
+
 var _constant = require("./constant");
 
 var _Comment = require("./Comment");
 
 var _lang = require("./lang");
 
-var _lang2 = _interopRequireDefault(_lang);
+var _enUS = require("./lang/en-US.js");
+
+var _enUS2 = _interopRequireDefault(_enUS);
+
+var _zhCN = require("./lang/zh-CN.js");
+
+var _zhCN2 = _interopRequireDefault(_zhCN);
 
 require("./App.css");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
 
 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
 
-// import styles from "./App.module.css";
+var LOCALES = {
+  "zh-CN": _zhCN2.default,
+  "en-US": _enUS2.default
+};
 
 var App = function (_Component) {
   _inherits(App, _Component);
       page: 1,
       total: 0,
       // 是否没有更多评论了
-      isNoMoreComment: false
+      isNoMoreComment: false,
+      initDone: false,
+      locale: "zh-CN"
     };
     _this.handleChangeLoading = _this.handleChangeLoading.bind(_this);
     _this.sCreateComment = _this.sCreateComment.bind(_this);
     }
   }, {
     key: "componentDidMount",
-    value: function componentDidMount() {}
+    value: function componentDidMount() {
+      this.loadLocales();
+    }
+
+    /**
+     * 加载语言包
+     * 只能根据url或者传入的props来确定加载哪个语言包
+     * 优先级：传入的props > url
+     */
+
+  }, {
+    key: "loadLocales",
+    value: function loadLocales() {
+      var _this2 = this;
+
+      var currentLocale = this.props.locales;
+
+      if (!currentLocale) {
+        currentLocale = _reactIntlUniversal2.default.determineLocale({
+          urlLocaleKey: "lang"
+        });
+      }
+      currentLocale = _lang.SUPPORT_LOCALES.find(function (item) {
+        return item.value === currentLocale;
+      }) ? currentLocale : "zh-CN";
+      _reactIntlUniversal2.default.init({
+        currentLocale: currentLocale,
+        locales: _defineProperty({}, currentLocale, LOCALES[currentLocale])
+      }).then(function () {
+        _this2.setState({ initDone: true, locale: currentLocale });
+      });
+    }
   }, {
     key: "error",
     value: function error(msg) {
   }, {
     key: "errorHandler",
     value: function errorHandler(error) {
+      var locale = this.state.locale;
+
+      var localResponse = _lang.LOCALES_RESPONSE[locale];
       if (error.response && error.response.data && error.response.data.msg) {
-        this.error(_lang2.default[error.response.data.msg] || _constant.ERROR_DEFAULT, {
+        this.error(localResponse[error.response.data.msg] || _constant.ERROR_DEFAULT, {
           response: error.response
         });
         return;
       }
-      this.error(_lang2.default[error.message] || _constant.ERROR_DEFAULT, {
+      this.error(localResponse[error.response.data.msg] || _constant.ERROR_DEFAULT, {
         response: error.response
       });
     }
   }, {
     key: "sGetComment",
     value: function sGetComment() {
-      var _this2 = this;
+      var _this3 = this;
 
       var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
           _ref$page = _ref.page,
 
         if (list) {
           var newList = list;
-          var oldList = _this2.state.list;
+          var oldList = _this3.state.list;
 
           if (pageType === "more") {
             if (page > 1) {
             window.scrollTo(0, 0);
           }
 
-          _this2.setState({
+          _this3.setState({
             list: newList,
             page: page,
             total: total
           });
         } else {
-          _message3.default.info("没有更多评论了");
-          _this2.setState({
+          _message3.default.info(_reactIntlUniversal2.default.get("message.noMoreComment"));
+          _this3.setState({
             isNoMoreComment: true
           });
         }
       }).catch(this.errorHandler).finally(function () {
-        _this2.handleChangeLoading("sGetComment", false);
+        _this3.handleChangeLoading("sGetComment", false);
       });
     }
 
   }, {
     key: "sGetReply",
     value: function sGetReply() {
-      var _this3 = this;
+      var _this4 = this;
 
       var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
           commentId = _ref2.commentId,
 
       this.axios.get(API + "/replies?comment_id=" + commentId + "&page=" + page + "&limit=" + limit).then(function (response) {
         if (!response.data.list) {
-          _message3.default.info("没有更多数据了！");
+          _message3.default.info(_reactIntlUniversal2.default.get("message.noMoreData"));
         }
-        var list = _this3.state.list.map(function (item) {
+        var list = _this4.state.list.map(function (item) {
           if (item.id === commentId) {
             if (!item.replies) item.replies = [];
             if (response.data.list) {
           }
           return item;
         });
-        _this3.setState({ list: list });
+        _this4.setState({ list: list });
       }).catch(this.errorHandler).finally(function () {
-        _this3.handleChangeLoading("sGetReply", false);
+        _this4.handleChangeLoading("sGetReply", false);
       });
     }
 
   }, {
     key: "sCreateComment",
     value: function sCreateComment() {
-      var _this4 = this;
+      var _this5 = this;
 
       var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
           content = _ref3.content;
 
       var cb = arguments[1];
 
-      if (!content) return this.error("评论内容不能为空 ");
+      if (!content) return this.error(_reactIntlUniversal2.default.get("message.notNull"));
       this.handleChangeLoading("sCreateComment", true);
       var _props3 = this.props,
           API = _props3.API,
         },
         withCredentials: true
       }).then(function (response) {
-        if (_this4.props.showAlertComment) {
-          _message3.default.success("评论成功！");
+        if (_this5.props.showAlertComment) {
+          _message3.default.success(_reactIntlUniversal2.default.get("message.success"));
         }
         if ((0, _helper.isFunction)(cb)) cb();
         // 将数据写入到 list 中
         // 临时插入
         // 等到获取数据之后，删除临时数据
-        var _state = _this4.state,
+        var _state = _this5.state,
             list = _state.list,
             total = _state.total;
 
         list.unshift(_extends({}, response.data, {
           isTemporary: true // 临时的数据
         }));
-        _this4.setState({ list: list, total: total + 1 });
+        _this5.setState({ list: list, total: total + 1 });
       }).catch(this.errorHandler).finally(function () {
-        _this4.handleChangeLoading("sCreateComment", false);
+        _this5.handleChangeLoading("sCreateComment", false);
       });
     }
 
   }, {
     key: "sDeleteComment",
     value: function sDeleteComment(commentId) {
-      var _this5 = this;
+      var _this6 = this;
 
       this.handleChangeLoading("sDeleteComment", true);
       var API = this.props.API;
         method: "delete",
         withCredentials: true
       }).then(function () {
-        var _state2 = _this5.state,
+        var _state2 = _this6.state,
             list = _state2.list,
             total = _state2.total;
 
         var res = list.filter(function (item) {
           return item.id !== commentId;
         });
-        _this5.setState({ list: res, total: total - 1 });
-        _this5.props.onDelete(_constant.COMMENT_TYPE.COMMENT);
+        _this6.setState({ list: res, total: total - 1 });
+        _this6.props.onDelete(_constant.COMMENT_TYPE.COMMENT);
       }).catch(this.errorHandler).finally(function () {
-        _this5.handleChangeLoading("sDeleteComment", false);
+        _this6.handleChangeLoading("sDeleteComment", false);
       });
     }
 
   }, {
     key: "sCreateReply",
     value: function sCreateReply(data, cb) {
-      var _this6 = this;
+      var _this7 = this;
 
-      if (!data.content) return this.error("回复内容不能为空 ");
+      if (!data.content) return this.error(_reactIntlUniversal2.default.get("message.replyNoNull"));
       this.handleChangeLoading("sCreateReply", true);
       var API = this.props.API;
 
         data: data,
         withCredentials: true
       }).then(function (response) {
-        if (_this6.props.showAlertReply) {
-          _message3.default.success("回复成功！");
+        if (_this7.props.showAlertReply) {
+          _message3.default.success(_reactIntlUniversal2.default.get("message.replySuccess"));
         }
         if ((0, _helper.isFunction)(cb)) cb();
         // 将数据写入到 list 中
         // 临时插入
         // 等到获取数据之后，删除临时数据
-        var list = _this6.state.list.map(function (item) {
+        var list = _this7.state.list.map(function (item) {
           if (item.id === data.comment_id) {
             if (!item.replies) item.replies = [];
             item.replies.push(_extends({}, response.data, {
           }
           return item;
         });
-        _this6.setState({ list: list });
+        _this7.setState({ list: list });
       }).catch(this.errorHandler).finally(function () {
-        _this6.handleChangeLoading("sCreateReply", false);
+        _this7.handleChangeLoading("sCreateReply", false);
       });
     }
 
   }, {
     key: "sDeleteReply",
     value: function sDeleteReply(replyId, commentId) {
-      var _this7 = this;
+      var _this8 = this;
 
       this.handleChangeLoading("sDeleteReply", true);
       var API = this.props.API;
         method: "delete",
         withCredentials: true
       }).then(function () {
-        var list = _this7.state.list.map(function (item) {
+        var list = _this8.state.list.map(function (item) {
           if (item.id === commentId) {
             var replies = item.replies.filter(function (item) {
               return item.id !== replyId;
           }
           return item;
         });
-        _this7.setState({ list: list });
-        _this7.props.onDelete(_constant.COMMENT_TYPE.REPLY);
+        _this8.setState({ list: list });
+        _this8.props.onDelete(_constant.COMMENT_TYPE.REPLY);
       }).catch(this.errorHandler).finally(function () {
-        _this7.handleChangeLoading("sDeleteReply", false);
+        _this8.handleChangeLoading("sDeleteReply", false);
       });
     }
 
   }, {
     key: "sCommentFavor",
     value: function sCommentFavor(commentId, favored) {
-      var _this8 = this;
+      var _this9 = this;
 
       this.handleChangeLoading("sCommentFavor", true);
       var API = this.props.API;
         method: favored ? "delete" : "put",
         withCredentials: true
       }).then(function (response) {
-        if (_this8.props.showAlertFavor) {
-          _message3.default.success(favored ? "取消点赞成功！" : "点赞成功！");
+        if (_this9.props.showAlertFavor) {
+          _message3.default.success(favored ? _reactIntlUniversal2.default.get("message.cancelLickSuccess") : _reactIntlUniversal2.default.get("message.likeSuccess"));
         }
         // 更新 list 中的该项数据的 favored
-        var list = _this8.state.list.map(function (item) {
+        var list = _this9.state.list.map(function (item) {
           if (item.id === commentId) {
             item.favored = !favored;
             item.favor_count += favored ? -1 : 1;
           }
           return item;
         });
-        _this8.setState({ list: list });
+        _this9.setState({ list: list });
       }).catch(this.errorHandler).finally(function () {
-        _this8.handleChangeLoading("sCommentFavor", false);
+        _this9.handleChangeLoading("sCommentFavor", false);
       });
     }
 
   }, {
     key: "sReplyFavor",
     value: function sReplyFavor(replyId, commentId, favored) {
-      var _this9 = this;
+      var _this10 = this;
 
       this.handleChangeLoading("sReplyFavor", true);
       var API = this.props.API;
         },
         withCredentials: true
       }).then(function (response) {
-        _message3.default.success(favored ? "取消点赞成功！" : "点赞成功！");
+        _message3.default.success(favored ? _reactIntlUniversal2.default.get("message.cancelLickSuccess") : _reactIntlUniversal2.default.get("message.likeSuccess"));
         // 更新 list 中的该项数据的 favored
-        var list = _this9.state.list.map(function (item) {
+        var list = _this10.state.list.map(function (item) {
           if (item.id === commentId) {
             item.replies = item.replies.map(function (r) {
               if (r.id === replyId) {
           }
           return item;
         });
-        _this9.setState({ list: list });
+        _this10.setState({ list: list });
       }).catch(this.errorHandler).finally(function () {
-        _this9.handleChangeLoading("sReplyFavor", false);
+        _this10.handleChangeLoading("sReplyFavor", false);
       });
     }
 
   }, {
     key: "sOssSts",
     value: function sOssSts() {
-      var _this10 = this;
+      var _this11 = this;
 
       this.handleChangeLoading("sOssSts", true);
       var API = this.props.API;
 
       this.axios.get(API + "/oss/sts").then(function (response) {
-        _this10.setState({ oss: _extends({}, response.data) });
+        _this11.setState({ oss: _extends({}, response.data) });
       }).catch(this.errorHandler).finally(function () {
-        _this10.handleChangeLoading("sOssSts", false);
+        _this11.handleChangeLoading("sOssSts", false);
       });
     }
   }, {
         sDeleteReply: this.sDeleteReply
       });
 
-      return _react2.default.createElement(
+      return this.state.initDone && _react2.default.createElement(
         _Comment.CommentContext.Provider,
         { value: value },
         _react2.default.createElement(
   limit: _propTypes2.default.number, // 一次加载评论数量
   onPageChange: _propTypes2.default.func, // 页码变化回调
   onGetMoreBtnClick: _propTypes2.default.func, // 点击查看更多按钮回调
-  onDelete: _propTypes2.default.func
+  onDelete: _propTypes2.default.func,
+  locales: _propTypes2.default.string //  传入的语言环境， en-US/zh-CN
 };
 
 App.defaultProps = {

lib/CHANGELOG.md

-# CHANGELOG
-
-
-## 0.1.0
-
-- [x] 不兼容更新。
-- [x] 添加了很多 `Props`
-- [x] 组件导出为 `Comment` 和 `Editor`
-
-
-
-

lib/Comment.js.map

-{"version":3,"sources":["../src/Comment.js"],"names":["Comment","CommentContext","React","createContext","Component","props","app"],"mappings":";;;;;;;;;QAKgBA,O,GAAAA,O;;AALhB;;;;;;AAEA,IAAMC,iBAAiBC,gBAAMC,aAAN,EAAvB;;AAEA;AACO,SAASH,OAAT,CAAiBI,SAAjB,EAA4B;AACjC;AACA,SAAO,UAASC,KAAT,EAAgB;AACrB;AACA;AACA,WACE;AAAC,oBAAD,CAAgB,QAAhB;AAAA;AACG;AAAA,eAAO,8BAAC,SAAD,eAAeA,KAAf,IAAsB,KAAKC,GAA3B,IAAP;AAAA;AADH,KADF;AAKD,GARD;AASD;;QAEQL,c,GAAAA,c;kBAEMD,O","file":"Comment.js","sourcesContent":["import React from \"react\";\n\nconst CommentContext = React.createContext();\n\n// This function takes a component...\nexport function Comment(Component) {\n  // ...and returns another component...\n  return function(props) {\n    // ... and renders the wrapped component with the context theme!\n    // Notice that we pass through any additional props as well\n    return (\n      <CommentContext.Consumer>\n        {app => <Component {...props} app={app} />}\n      </CommentContext.Consumer>\n    );\n  };\n}\n\nexport { CommentContext };\n\nexport default Comment;\n"]}
+{"version":3,"sources":["../src/Comment.js"],"names":["Comment","CommentContext","React","createContext","Component","props","app"],"mappings":";;;;;;;;;QAKgBA,O,GAAAA,O;;AALhB;;;;;;AAEA,IAAMC,iBAAiBC,gBAAMC,aAAN,EAAvB;;AAEA;AACO,SAASH,OAAT,CAAiBI,SAAjB,EAA4B;AACjC;AACA,SAAO,UAASC,KAAT,EAAgB;AACrB;AACA;AACA,WACE;AAAC,oBAAD,CAAgB,QAAhB;AAAA;AACG;AAAA,eAAO,8BAAC,SAAD,eAAeA,KAAf,IAAsB,KAAKC,GAA3B,IAAP;AAAA;AADH,KADF;AAKD,GARD;AASD;;QAEQL,c,GAAAA,c;kBAEMD,O","file":"Comment.js","sourcesContent":["import React from \"react\";\r\n\r\nconst CommentContext = React.createContext();\r\n\r\n// This function takes a component...\r\nexport function Comment(Component) {\r\n  // ...and returns another component...\r\n  return function(props) {\r\n    // ... and renders the wrapped component with the context theme!\r\n    // Notice that we pass through any additional props as well\r\n    return (\r\n      <CommentContext.Consumer>\r\n        {app => <Component {...props} app={app} />}\r\n      </CommentContext.Consumer>\r\n    );\r\n  };\r\n}\r\n\r\nexport { CommentContext };\r\n\r\nexport default Comment;\r\n"]}

lib/axios.js.map

-{"version":3,"sources":["../src/axios.js"],"names":["axios","defaults","withCredentials","headers","common"],"mappings":";;;;;;AAAA;;;;;;AAEAA,gBAAMC,QAAN,CAAeC,eAAf,GAAiC,IAAjC;AACAF,gBAAMC,QAAN,CAAeE,OAAf,CAAuBC,MAAvB,CAA8B,eAA9B,IAAiD,SAAjD;;kBAEeJ,e","file":"axios.js","sourcesContent":["import axios from \"axios\";\n\naxios.defaults.withCredentials = true;\naxios.defaults.headers.common[\"Authorization\"] = \"Bearer \";\n\nexport default axios;\n"]}
+{"version":3,"sources":["../src/axios.js"],"names":["axios","defaults","withCredentials","headers","common"],"mappings":";;;;;;AAAA;;;;;;AAEAA,gBAAMC,QAAN,CAAeC,eAAf,GAAiC,IAAjC;AACAF,gBAAMC,QAAN,CAAeE,OAAf,CAAuBC,MAAvB,CAA8B,eAA9B,IAAiD,SAAjD;;kBAEeJ,e","file":"axios.js","sourcesContent":["import axios from \"axios\";\r\n\r\naxios.defaults.withCredentials = true;\r\naxios.defaults.headers.common[\"Authorization\"] = \"Bearer \";\r\n\r\nexport default axios;\r\n"]}

lib/components/CommentBox/index.js

 
 var _propTypes2 = _interopRequireDefault(_propTypes);
 
+var _reactIntlUniversal = require("react-intl-universal");
+
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
+
 var _Comment = require("../../Comment");
 
 var _Comment2 = _interopRequireDefault(_Comment);
                       return _this2.handleGetMoreReply(commentId);
                     }
                   },
-                  "\u67E5\u770B\u66F4\u591A\u56DE\u590D"
+                  _reactIntlUniversal2.default.get("reply.moreReply")
                 ),
                 _react2.default.createElement(
                   "a",
                     onClick: _this2.handleToggleReply
                   },
                   _react2.default.createElement(_icon2.default, { type: "up" }),
-                  " \u6536\u8D77\u56DE\u590D"
+                  " ",
+                  _reactIntlUniversal2.default.get("reply.collapse")
                 )
               )];
             }

lib/components/CommentList/index.js

 
 var _react2 = _interopRequireDefault(_react);
 
+var _reactIntlUniversal = require("react-intl-universal");
+
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
+
 var _Comment = require("../../Comment");
 
 var _Comment2 = _interopRequireDefault(_Comment);
             _react2.default.createElement(
               "span",
               null,
-              "\u67E5\u770B\u66F4\u591A\u8BC4\u8BBA"
+              _reactIntlUniversal2.default.get("comment.moreComment")
             )
           );
         } else {
           _react2.default.createElement(
             "div",
             null,
-            "\u5171 ",
-            total,
-            " \u6761\u8BC4\u8BBA"
+            _reactIntlUniversal2.default.get("comment.totalComment", { total: total })
           ),
           list.map(function (item) {
             return _react2.default.createElement(_CommentBox2.default, { content: item, key: item.id, commentId: item.id });

lib/components/CommentList/index.js.map

-{"version":3,"sources":["../../../src/components/CommentList/index.js"],"names":["CommentList","props","state","app","sGetComment","page","list","total","pageType","limit","isNoMoreComment","onPageChange","onGetMoreBtnClick","length","p","loading","spinning","Boolean","sCommentFavor","sReplyFavor","map","item","id","renderPagination","Component","propTypes"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;;;;AAEA;;;;AACA;;;;AACA;;;;;;;;;;IAEMA,W;;;AACJ,uBAAYC,KAAZ,EAAmB;AAAA;;AAAA,0HACXA,KADW;;AAEjB,UAAKC,KAAL,GAAa,EAAb;AAFiB;AAGlB;;;;yCAEoB;AACnB,WAAKD,KAAL,CAAWE,GAAX,CAAeC,WAAf,CAA2B,EAAEC,MAAM,KAAKJ,KAAL,CAAWE,GAAX,CAAeE,IAAvB,EAA3B;AACD;;;uCAEkB;AAAA,uBAWb,KAAKJ,KAAL,CAAWE,GAXE;AAAA,UAEfG,IAFe,cAEfA,IAFe;AAAA,UAGfC,KAHe,cAGfA,KAHe;AAAA,UAIfF,IAJe,cAIfA,IAJe;AAAA,UAKfG,QALe,cAKfA,QALe;AAAA,UAMfC,KANe,cAMfA,KANe;AAAA,UAOfC,eAPe,cAOfA,eAPe;AAAA,UAQfN,WARe,cAQfA,WARe;AAAA,UASfO,YATe,cASfA,YATe;AAAA,UAUfC,iBAVe,cAUfA,iBAVe;;AAYjB,UAAIJ,aAAa,OAAjB,EAA0B;AACxB;AACA,eACE;AAAA;AAAA,YAAK,WAAU,wBAAf,EAAwC,SAASI,iBAAjD;AACE;AAAA;AAAA;AAAA;AAAA;AADF,SADF;AAKD,OAPD,MAOO,IAAIJ,aAAa,MAAjB,EAAyB;AAC9B,YAAI,CAACE,eAAD,IAAoBJ,KAAKO,MAAL,KAAgBN,KAAxC,EAA+C;AAC7C,iBACE;AAAA;AAAA;AACE,yBAAU,wBADZ;AAEE,uBAAS,mBAAM;AACbH,4BAAY,EAAEC,MAAMA,OAAO,CAAf,EAAZ;AACAM,6BAAaN,OAAO,CAApB;AACD;AALH;AAOE;AAAA;AAAA;AAAA;AAAA;AAPF,WADF;AAWD,SAZD,MAYO;AACL,iBAAO,IAAP;AACD;AACF,OAhBM,MAgBA,IAAIG,aAAa,YAAjB,EAA+B;AACpC,eACE;AAAA;AAAA,YAAK,WAAU,yBAAf;AACE;AACE,sBAAUC,KADZ;AAEE,qBAASJ,IAFX;AAGE,mBAAOE,KAHT;AAIE,sBAAU,qBAAK;AACbH,0BAAY,EAAEC,MAAMS,CAAR,EAAZ;AACAH,2BAAaG,CAAb;AACD;AAPH;AADF,SADF;AAaD;AACF;;;6BAEQ;AAAA,wBAC0B,KAAKb,KAAL,CAAWE,GADrC;AAAA,UACCG,IADD,eACCA,IADD;AAAA,UACOC,KADP,eACOA,KADP;AAAA,UACcQ,OADd,eACcA,OADd;;;AAGP,UAAMC,WAAWC,QACfF,QAAQX,WAAR,IAAuBW,QAAQG,aAA/B,IAAgDH,QAAQI,WADzC,CAAjB;AAGA,aACE;AAAA;AAAA;AACE;AAAA;AAAA,YAAM,UAAUH,QAAhB;AACE;AAAA;AAAA;AAAA;AAAQT,iBAAR;AAAA;AAAA,WADF;AAEGD,eAAKc,GAAL,CAAS;AAAA,mBACR,8BAAC,oBAAD,IAAY,SAASC,IAArB,EAA2B,KAAKA,KAAKC,EAArC,EAAyC,WAAWD,KAAKC,EAAzD,GADQ;AAAA,WAAT,CAFH;AAKG,eAAKC,gBAAL;AALH;AADF,OADF;AAWD;;;;EA/EuBC,gB;;AAkF1BxB,YAAYyB,SAAZ,GAAwB,EAAxB;;kBAEe,uBAAQzB,WAAR,C","file":"index.js","sourcesContent":["import React, { Component } from \"react\";\nimport { Spin, Pagination } from \"antd\";\nimport Comment from \"../../Comment\";\nimport CommentBox from \"../CommentBox\";\nimport \"./index.css\";\n\nclass CommentList extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {};\n  }\n\n  componentWillMount() {\n    this.props.app.sGetComment({ page: this.props.app.page });\n  }\n\n  renderPagination() {\n    const {\n      list,\n      total,\n      page,\n      pageType,\n      limit,\n      isNoMoreComment,\n      sGetComment,\n      onPageChange,\n      onGetMoreBtnClick\n    } = this.props.app;\n    if (pageType === \"slice\") {\n      // 截断多余评论，通过点击查看更多跳转\n      return (\n        <div className=\"comment-list-show-more\" onClick={onGetMoreBtnClick}>\n          <span>查看更多</span>\n        </div>\n      );\n    } else if (pageType === \"more\") {\n      if (!isNoMoreComment && list.length !== total) {\n        return (\n          <div\n            className=\"comment-list-show-more\"\n            onClick={() => {\n              sGetComment({ page: page + 1 });\n              onPageChange(page + 1);\n            }}\n          >\n            <span>查看更多评论</span>\n          </div>\n        );\n      } else {\n        return null;\n      }\n    } else if (pageType === \"pagination\") {\n      return (\n        <div className=\"comment-list-pagination\">\n          <Pagination\n            pageSize={limit}\n            current={page}\n            total={total}\n            onChange={p => {\n              sGetComment({ page: p });\n              onPageChange(p);\n            }}\n          />\n        </div>\n      );\n    }\n  }\n\n  render() {\n    const { list, total, loading } = this.props.app;\n\n    const spinning = Boolean(\n      loading.sGetComment || loading.sCommentFavor || loading.sReplyFavor\n    );\n    return (\n      <div>\n        <Spin spinning={spinning}>\n          <div>共 {total} 条评论</div>\n          {list.map(item => (\n            <CommentBox content={item} key={item.id} commentId={item.id} />\n          ))}\n          {this.renderPagination()}\n        </Spin>\n      </div>\n    );\n  }\n}\n\nCommentList.propTypes = {};\n\nexport default Comment(CommentList);\n"]}
+{"version":3,"sources":["../../../src/components/CommentList/index.js"],"names":["CommentList","props","state","app","sGetComment","page","list","total","pageType","limit","isNoMoreComment","onPageChange","onGetMoreBtnClick","length","intl","get","p","loading","spinning","Boolean","sCommentFavor","sReplyFavor","map","item","id","renderPagination","Component","propTypes"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;;;;AAEA;;;;AACA;;;;AACA;;;;AACA;;;;;;;;;;IAEMA,W;;;AACJ,uBAAYC,KAAZ,EAAmB;AAAA;;AAAA,0HACXA,KADW;;AAEjB,UAAKC,KAAL,GAAa,EAAb;AAFiB;AAGlB;;;;yCAEoB;AACnB,WAAKD,KAAL,CAAWE,GAAX,CAAeC,WAAf,CAA2B,EAAEC,MAAM,KAAKJ,KAAL,CAAWE,GAAX,CAAeE,IAAvB,EAA3B;AACD;;;uCAEkB;AAAA,uBAWb,KAAKJ,KAAL,CAAWE,GAXE;AAAA,UAEfG,IAFe,cAEfA,IAFe;AAAA,UAGfC,KAHe,cAGfA,KAHe;AAAA,UAIfF,IAJe,cAIfA,IAJe;AAAA,UAKfG,QALe,cAKfA,QALe;AAAA,UAMfC,KANe,cAMfA,KANe;AAAA,UAOfC,eAPe,cAOfA,eAPe;AAAA,UAQfN,WARe,cAQfA,WARe;AAAA,UASfO,YATe,cASfA,YATe;AAAA,UAUfC,iBAVe,cAUfA,iBAVe;;AAYjB,UAAIJ,aAAa,OAAjB,EAA0B;AACxB;AACA,eACE;AAAA;AAAA,YAAK,WAAU,wBAAf,EAAwC,SAASI,iBAAjD;AACE;AAAA;AAAA;AAAA;AAAA;AADF,SADF;AAKD,OAPD,MAOO,IAAIJ,aAAa,MAAjB,EAAyB;AAC9B,YAAI,CAACE,eAAD,IAAoBJ,KAAKO,MAAL,KAAgBN,KAAxC,EAA+C;AAC7C,iBACE;AAAA;AAAA;AACE,yBAAU,wBADZ;AAEE,uBAAS,mBAAM;AACbH,4BAAY,EAAEC,MAAMA,OAAO,CAAf,EAAZ;AACAM,6BAAaN,OAAO,CAApB;AACD;AALH;AAOE;AAAA;AAAA;AAAOS,2CAAKC,GAAL,CAAS,qBAAT;AAAP;AAPF,WADF;AAWD,SAZD,MAYO;AACL,iBAAO,IAAP;AACD;AACF,OAhBM,MAgBA,IAAIP,aAAa,YAAjB,EAA+B;AACpC,eACE;AAAA;AAAA,YAAK,WAAU,yBAAf;AACE;AACE,sBAAUC,KADZ;AAEE,qBAASJ,IAFX;AAGE,mBAAOE,KAHT;AAIE,sBAAU,qBAAK;AACbH,0BAAY,EAAEC,MAAMW,CAAR,EAAZ;AACAL,2BAAaK,CAAb;AACD;AAPH;AADF,SADF;AAaD;AACF;;;6BAEQ;AAAA,wBAC0B,KAAKf,KAAL,CAAWE,GADrC;AAAA,UACCG,IADD,eACCA,IADD;AAAA,UACOC,KADP,eACOA,KADP;AAAA,UACcU,OADd,eACcA,OADd;;;AAGP,UAAMC,WAAWC,QACfF,QAAQb,WAAR,IAAuBa,QAAQG,aAA/B,IAAgDH,QAAQI,WADzC,CAAjB;AAGA,aACE;AAAA;AAAA;AACE;AAAA;AAAA,YAAM,UAAUH,QAAhB;AAEE;AAAA;AAAA;AAAMJ,yCAAKC,GAAL,CAAS,sBAAT,EAAiC,EAAER,YAAF,EAAjC;AAAN,WAFF;AAGGD,eAAKgB,GAAL,CAAS;AAAA,mBACR,8BAAC,oBAAD,IAAY,SAASC,IAArB,EAA2B,KAAKA,KAAKC,EAArC,EAAyC,WAAWD,KAAKC,EAAzD,GADQ;AAAA,WAAT,CAHH;AAMG,eAAKC,gBAAL;AANH;AADF,OADF;AAYD;;;;EAhFuBC,gB;;AAmF1B1B,YAAY2B,SAAZ,GAAwB,EAAxB;;kBAEe,uBAAQ3B,WAAR,C","file":"index.js","sourcesContent":["import React, { Component } from \"react\";\r\nimport { Spin, Pagination } from \"antd\";\r\nimport intl from \"react-intl-universal\";\r\nimport Comment from \"../../Comment\";\r\nimport CommentBox from \"../CommentBox\";\r\nimport \"./index.css\";\r\n\r\nclass CommentList extends Component {\r\n  constructor(props) {\r\n    super(props);\r\n    this.state = {};\r\n  }\r\n\r\n  componentWillMount() {\r\n    this.props.app.sGetComment({ page: this.props.app.page });\r\n  }\r\n\r\n  renderPagination() {\r\n    const {\r\n      list,\r\n      total,\r\n      page,\r\n      pageType,\r\n      limit,\r\n      isNoMoreComment,\r\n      sGetComment,\r\n      onPageChange,\r\n      onGetMoreBtnClick\r\n    } = this.props.app;\r\n    if (pageType === \"slice\") {\r\n      // 截断多余评论，通过点击查看更多跳转\r\n      return (\r\n        <div className=\"comment-list-show-more\" onClick={onGetMoreBtnClick}>\r\n          <span>查看更多</span>\r\n        </div>\r\n      );\r\n    } else if (pageType === \"more\") {\r\n      if (!isNoMoreComment && list.length !== total) {\r\n        return (\r\n          <div\r\n            className=\"comment-list-show-more\"\r\n            onClick={() => {\r\n              sGetComment({ page: page + 1 });\r\n              onPageChange(page + 1);\r\n            }}\r\n          >\r\n            <span>{intl.get(\"comment.moreComment\")}</span>\r\n          </div>\r\n        );\r\n      } else {\r\n        return null;\r\n      }\r\n    } else if (pageType === \"pagination\") {\r\n      return (\r\n        <div className=\"comment-list-pagination\">\r\n          <Pagination\r\n            pageSize={limit}\r\n            current={page}\r\n            total={total}\r\n            onChange={p => {\r\n              sGetComment({ page: p });\r\n              onPageChange(p);\r\n            }}\r\n          />\r\n        </div>\r\n      );\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const { list, total, loading } = this.props.app;\r\n\r\n    const spinning = Boolean(\r\n      loading.sGetComment || loading.sCommentFavor || loading.sReplyFavor\r\n    );\r\n    return (\r\n      <div>\r\n        <Spin spinning={spinning}>\r\n          {/* <div>共 {total} 条评论</div> */}\r\n          <div>{intl.get(\"comment.totalComment\", { total })}</div>\r\n          {list.map(item => (\r\n            <CommentBox content={item} key={item.id} commentId={item.id} />\r\n          ))}\r\n          {this.renderPagination()}\r\n        </Spin>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n\r\nCommentList.propTypes = {};\r\n\r\nexport default Comment(CommentList);\r\n"]}

lib/components/ContentItem/index.js

 
 var _relativeTime2 = _interopRequireDefault(_relativeTime);
 
+var _reactIntlUniversal = require("react-intl-universal");
+
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
+
 var _Comment = require("../../Comment");
 
 var _Comment2 = _interopRequireDefault(_Comment);
 function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
 
 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+// import 'dayjs/locale/es';
+
 
-_dayjs2.default.locale("zh-cn");
+// dayjs.locale("zh-cn");
 _dayjs2.default.extend(_relativeTime2.default);
 
+var LOCALES = {
+  "zh-CN": "zh-cn"
+};
+
 var CommentItem = function (_Component) {
   _inherits(CommentItem, _Component);
 
           showReply = _props.showReply,
           onShowReply = _props.onShowReply,
           app = _props.app;
+      var locale = this.props.app.locale;
       var showInput = this.state.showInput;
 
 
             _react2.default.createElement(
               "strong",
               null,
-              content.user_name || "游客"
+              content.user_name || _reactIntlUniversal2.default.get("comment.tourist")
             ),
             _react2.default.createElement(
               "span",
                   placement: "top",
                   title: (0, _dayjs2.default)(content.created * 1000).format("YYYY-MM-DD HH:mm:ss")
                 },
-                (0, _dayjs2.default)(content.created * 1000).fromNow()
+                LOCALES[locale] ? (0, _dayjs2.default)(content.created * 1000).locale(LOCALES[locale]).fromNow() : (0, _dayjs2.default)(content.created * 1000).fromNow()
               )
             )
           ),
               _react2.default.createElement(
                 "a",
                 { className: "comment-item-bottom-left", onClick: onShowReply },
-                content.reply_count,
-                " \u6761\u56DE\u590D",
+                _reactIntlUniversal2.default.get("reply.totalReply", { total: content.reply_count }),
                 showReply ? _react2.default.createElement(_icon2.default, { type: "up" }) : _react2.default.createElement(_icon2.default, { type: "down" })
               )
             ) : null,
             app.userId === content.user_id && _react2.default.createElement(
               _popconfirm2.default,
               {
-                title: "\u786E\u5B9A\u8981\u5220\u9664\u5417?",
+                // title="确定要删除吗?"
+                title: _reactIntlUniversal2.default.get("popConfirm.title"),
                 onConfirm: function onConfirm() {
                   if (replyId) {
                     app.sDeleteReply(content.id, commentId);
                   }
                   app.sDeleteComment(content.id);
                 },
-                okText: "\u786E\u5B9A",
-                cancelText: "\u53D6\u6D88"
+                okText: _reactIntlUniversal2.default.get("popConfirm.ok"),
+                cancelText: _reactIntlUniversal2.default.get("popConfirm.cancel")
               },
               _react2.default.createElement(
                 "a",
                 { className: "comment-item-bottom-right" },
-                "\xA0 \u5220\u9664"
+                "\xA0 ",
+                _reactIntlUniversal2.default.get("popConfirm.delete")
               )
             ),
             _react2.default.createElement(
                 onClick: this.handleToggleInput,
                 className: "comment-item-bottom-right"
               },
-              "\xA0 \u56DE\u590D"
+              "\xA0 ",
+              _reactIntlUniversal2.default.get("comment.reply")
             ),
             _react2.default.createElement(
               "div",

lib/components/Editor/Emoji.js.map

-{"version":3,"sources":["../../../src/components/Editor/Emoji.js"],"names":["Emoji","carousel","next","prev","onClick","props","content","curPage","i","length","push","emoji","node","map","page","index","item","value","prefixUrl","ext","title","display","React","Component"],"mappings":";;;;;;;;;;;;;;AAAA;;;;AAEA;;;;AACA;;;;;;;;;;AACA;AACA;;AAEA;;IAEMA,K;;;;;;;;;;;2BACG;AACL,UAAI,KAAKC,QAAT,EAAmB;AACjB,aAAKA,QAAL,CAAcC,IAAd;AACD;AACF;;;2BAEM;AACL,UAAI,KAAKD,QAAT,EAAmB;AACjB,aAAKA,QAAL,CAAcE,IAAd;AACD;AACF;;;6BAEQ;AAAA;;AAAA,UACCC,QADD,GACa,KAAKC,KADlB,CACCD,OADD;;AAEP,UAAME,UAAU,EAAhB;AACA,UAAIC,UAAU,EAAd;AACA,WAAK,IAAIC,IAAI,CAAb,EAAgBA,IAAI,GAApB,EAAyBA,GAAzB,EAA8B;AAC5B,YAAID,QAAQE,MAAR,GAAiB,EAArB,EAAyB;AACvBF,kBAAQG,IAAR,CAAaC,gBAAMH,CAAN,CAAb;AACD,SAFD,MAEO;AACLF,kBAAQI,IAAR,CAAaH,OAAb;AACAA,oBAAU,EAAV;AACD;AACF;AACD,UAAIA,QAAQE,MAAR,GAAiB,CAArB,EAAwB;AACtBH,gBAAQI,IAAR,CAAaH,OAAb;AACD;AACD,aACE;AAAA;AAAA;AACE,eAAK,mBAAQ;AACX,mBAAKN,QAAL,GAAgBW,IAAhB;AACD;AAHH;AAKGN,gBAAQO,GAAR,CAAY,UAACC,IAAD,EAAOC,KAAP;AAAA,iBACX;AAAA;AAAA,cAAK,KAAKA,KAAV,EAAiB,WAAU,OAA3B;AACGD,iBAAKD,GAAL,CAAS,UAACG,IAAD,EAAOD,KAAP;AAAA,qBACR;AAAA;AAAA,kBAAK,WAAU,MAAf,EAAsB,KAAKC,KAAKC,KAAhC;AACE,wDAAM,WAAU,QAAhB,GADF;AAEE;AACE,4BAAQC,gBAAR,GAAoBF,KAAKC,KAAzB,SAAkCD,KAAKG,GADzC;AAEE,uBAAKH,KAAKI,KAFZ;AAGE,yBAAO,EAAEC,SAAS,cAAX,EAHT;AAIE,2BAAS;AAAA,2BAAMjB,SAAQY,KAAKI,KAAb,CAAN;AAAA;AAJX;AAFF,eADQ;AAAA,aAAT;AADH,WADW;AAAA,SAAZ;AALH,OADF;AAuBD;;;;EAnDiBE,gBAAMC,S;;kBAsDXvB,K","file":"Emoji.js","sourcesContent":["import React from \"react\";\nimport { Carousel } from \"antd\";\nimport emoji, { prefixUrl } from \"../../emoji\";\nimport \"./Emoji.css\";\n// 每页 20  5*4\n// 共 20 * 3 = 60 (实际是 54)\n\n// class Emoji\n\nclass Emoji extends React.Component {\n  next() {\n    if (this.carousel) {\n      this.carousel.next();\n    }\n  }\n\n  prev() {\n    if (this.carousel) {\n      this.carousel.prev();\n    }\n  }\n\n  render() {\n    const { onClick } = this.props;\n    const content = [];\n    let curPage = [];\n    for (let i = 0; i < 115; i++) {\n      if (curPage.length < 30) {\n        curPage.push(emoji[i]);\n      } else {\n        content.push(curPage);\n        curPage = [];\n      }\n    }\n    if (curPage.length > 0) {\n      content.push(curPage);\n    }\n    return (\n      <Carousel\n        ref={node => {\n          this.carousel = node;\n        }}\n      >\n        {content.map((page, index) => (\n          <div key={index} className=\"emoji\">\n            {page.map((item, index) => (\n              <div className=\"item\" key={item.value}>\n                <span className=\"helper\" />\n                <img\n                  src={`${prefixUrl}${item.value}.${item.ext}`}\n                  alt={item.title}\n                  style={{ display: \"inline-block\" }}\n                  onClick={() => onClick(item.title)}\n                />\n              </div>\n            ))}\n          </div>\n        ))}\n      </Carousel>\n    );\n  }\n}\n\nexport default Emoji;\n"]}
+{"version":3,"sources":["../../../src/components/Editor/Emoji.js"],"names":["Emoji","carousel","next","prev","onClick","props","content","curPage","i","length","push","emoji","node","map","page","index","item","value","prefixUrl","ext","title","display","React","Component"],"mappings":";;;;;;;;;;;;;;AAAA;;;;AAEA;;;;AACA;;;;;;;;;;AACA;AACA;;AAEA;;IAEMA,K;;;;;;;;;;;2BACG;AACL,UAAI,KAAKC,QAAT,EAAmB;AACjB,aAAKA,QAAL,CAAcC,IAAd;AACD;AACF;;;2BAEM;AACL,UAAI,KAAKD,QAAT,EAAmB;AACjB,aAAKA,QAAL,CAAcE,IAAd;AACD;AACF;;;6BAEQ;AAAA;;AAAA,UACCC,QADD,GACa,KAAKC,KADlB,CACCD,OADD;;AAEP,UAAME,UAAU,EAAhB;AACA,UAAIC,UAAU,EAAd;AACA,WAAK,IAAIC,IAAI,CAAb,EAAgBA,IAAI,GAApB,EAAyBA,GAAzB,EAA8B;AAC5B,YAAID,QAAQE,MAAR,GAAiB,EAArB,EAAyB;AACvBF,kBAAQG,IAAR,CAAaC,gBAAMH,CAAN,CAAb;AACD,SAFD,MAEO;AACLF,kBAAQI,IAAR,CAAaH,OAAb;AACAA,oBAAU,EAAV;AACD;AACF;AACD,UAAIA,QAAQE,MAAR,GAAiB,CAArB,EAAwB;AACtBH,gBAAQI,IAAR,CAAaH,OAAb;AACD;AACD,aACE;AAAA;AAAA;AACE,eAAK,mBAAQ;AACX,mBAAKN,QAAL,GAAgBW,IAAhB;AACD;AAHH;AAKGN,gBAAQO,GAAR,CAAY,UAACC,IAAD,EAAOC,KAAP;AAAA,iBACX;AAAA;AAAA,cAAK,KAAKA,KAAV,EAAiB,WAAU,OAA3B;AACGD,iBAAKD,GAAL,CAAS,UAACG,IAAD,EAAOD,KAAP;AAAA,qBACR;AAAA;AAAA,kBAAK,WAAU,MAAf,EAAsB,KAAKC,KAAKC,KAAhC;AACE,wDAAM,WAAU,QAAhB,GADF;AAEE;AACE,4BAAQC,gBAAR,GAAoBF,KAAKC,KAAzB,SAAkCD,KAAKG,GADzC;AAEE,uBAAKH,KAAKI,KAFZ;AAGE,yBAAO,EAAEC,SAAS,cAAX,EAHT;AAIE,2BAAS;AAAA,2BAAMjB,SAAQY,KAAKI,KAAb,CAAN;AAAA;AAJX;AAFF,eADQ;AAAA,aAAT;AADH,WADW;AAAA,SAAZ;AALH,OADF;AAuBD;;;;EAnDiBE,gBAAMC,S;;kBAsDXvB,K","file":"Emoji.js","sourcesContent":["import React from \"react\";\r\nimport { Carousel } from \"antd\";\r\nimport emoji, { prefixUrl } from \"../../emoji\";\r\nimport \"./Emoji.css\";\r\n// 每页 20  5*4\r\n// 共 20 * 3 = 60 (实际是 54)\r\n\r\n// class Emoji\r\n\r\nclass Emoji extends React.Component {\r\n  next() {\r\n    if (this.carousel) {\r\n      this.carousel.next();\r\n    }\r\n  }\r\n\r\n  prev() {\r\n    if (this.carousel) {\r\n      this.carousel.prev();\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const { onClick } = this.props;\r\n    const content = [];\r\n    let curPage = [];\r\n    for (let i = 0; i < 115; i++) {\r\n      if (curPage.length < 30) {\r\n        curPage.push(emoji[i]);\r\n      } else {\r\n        content.push(curPage);\r\n        curPage = [];\r\n      }\r\n    }\r\n    if (curPage.length > 0) {\r\n      content.push(curPage);\r\n    }\r\n    return (\r\n      <Carousel\r\n        ref={node => {\r\n          this.carousel = node;\r\n        }}\r\n      >\r\n        {content.map((page, index) => (\r\n          <div key={index} className=\"emoji\">\r\n            {page.map((item, index) => (\r\n              <div className=\"item\" key={item.value}>\r\n                <span className=\"helper\" />\r\n                <img\r\n                  src={`${prefixUrl}${item.value}.${item.ext}`}\r\n                  alt={item.title}\r\n                  style={{ display: \"inline-block\" }}\r\n                  onClick={() => onClick(item.title)}\r\n                />\r\n              </div>\r\n            ))}\r\n          </div>\r\n        ))}\r\n      </Carousel>\r\n    );\r\n  }\r\n}\r\n\r\nexport default Emoji;\r\n"]}

lib/components/Editor/Upload.js

 
 var _shortid2 = _interopRequireDefault(_shortid);
 
+var _reactIntlUniversal = require("react-intl-universal");
+
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
+
 var _constant = require("../../constant");
 
 var _Comment = require("../../Comment");
         _react2.default.createElement(
           "div",
           { className: "ant-upload-text" },
-          "\u4E0A\u4F20"
+          _reactIntlUniversal2.default.get("editor.uploadBtn")
         )
       );
       return _react2.default.createElement(

lib/components/Editor/index.js

 
 var _classnames2 = _interopRequireDefault(_classnames);
 
+var _reactIntlUniversal = require("react-intl-universal");
+
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
+
 var _constant = require("../../constant");
 
 var _helper = require("../../helper");
           fileList = _state.fileList;
 
       if (value.length > maxLength) {
-        _message3.default.error("\u5B57\u6570\u4E0D\u5F97\u8D85\u8FC7" + maxLength + "\u5B57");
+        // message.error(`字数不得超过${maxLength}字`);
+        _message3.default.error(_reactIntlUniversal2.default.get("editor.maxLength", { maxLength: maxLength }));
         return;
       }
       var files = [];
 
       var _props = this.props,
           value = _props.value,
-          placeholder = _props.placeholder,
           rows = _props.rows,
           showEmoji = _props.showEmoji,
           showUpload = _props.showUpload,
           closeUploadWhenBlur = _props.closeUploadWhenBlur,
           maxUpload = _props.maxUpload,
-          btnSubmitText = _props.btnSubmitText,
           btnLoading = _props.btnLoading,
           btnDisabled = _props.btnDisabled,
           button = _props.button,
           maxLength = _props.maxLength,
           autoFocus = _props.autoFocus;
 
+      var placeholder = this.props.placeholder || _reactIntlUniversal2.default.get("editor.placeholder");
+      var btnSubmitText = this.props.placeholder || _reactIntlUniversal2.default.get("editor.SubmitBtn");
       var handleSubmit = this.handleSubmit;
       var disabledSubmit = btnDisabled || !this.props.value && !this.state.value && !this.state.fileList.length;
       var inputValue = value || this.state.value;
               "comment-editor-toolbar-error": inputValue.length > maxLength
             })
           },
-          "\u5DF2\u8F93\u5165 ",
-          inputValue.length,
-          " / ",
-          maxLength,
-          " \u5B57"
+          _reactIntlUniversal2.default.get("editor.alreadyEntered", {
+            count: inputValue.length,
+            maxLength: maxLength
+          })
         ),
         _react2.default.createElement(
           "div",
                     _react2.default.createElement(
                       "span",
                       null,
-                      "\u4E0A\u4F20\u56FE\u7247",
+                      _reactIntlUniversal2.default.get("editor.uploadTip"),
                       maxUpload >= 2 ? _react2.default.createElement(
                         "span",
                         { style: { color: "#666", fontWeight: 400 } },
 
 Editor.defaultProps = {
   rows: 5,
-  placeholder: "说点什么吧...",
+  // placeholder: "说点什么吧",
   showEmoji: true,
   showUpload: true,
   closeUploadWhenBlur: false,
   maxUpload: 1,
-  btnSubmitText: "发表",
+  // btnSubmitText: "发表",
   btnLoading: false,
   btnDisabled: false,
   showError: true,

lib/components/ImagePreviewer/ImagePreviewer.js

 
 var _classnames2 = _interopRequireDefault(_classnames);
 
+var _reactIntlUniversal = require("react-intl-universal");
+
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
+
 require("./ImagePreviewer.less");
 
 var _helper = require("../../helper");
             "span",
             { className: "button", onClick: onFold },
             _react2.default.createElement(_icon2.default, { type: "to-top" }),
-            "\u6536\u8D77"
+            _reactIntlUniversal2.default.get("picture.collapse")
           ),
           _react2.default.createElement(
             "span",
             { className: "button", onClick: this.onOrigin },
             _react2.default.createElement(_icon2.default, { type: "search" }),
-            " \u67E5\u770B\u539F\u56FE"
+            " ",
+            _reactIntlUniversal2.default.get("picture.viewOriginal")
           )
         ),
         _react2.default.createElement(

lib/components/RenderText/index.js.map

-{"version":3,"sources":["../../../src/components/RenderText/index.js"],"names":["App","__html","text"],"mappings":";;;;;;AAAA;;;;AACA;;;;AAEA,IAAMA,MAAM,SAANA,GAAM;AAAA,SACV;AACE,eAAU,sBADZ;AAEE,6BAAyB;AACvBC,cAAQ,2BAAcC,IAAd;AADe;AAF3B,IADU;AAAA,CAAZ;;kBASeF,G","file":"index.js","sourcesContent":["import React from \"react\";\nimport { renderContent } from \"../../helper\";\n\nconst App = text => (\n  <div\n    className=\"comment-item-content\"\n    dangerouslySetInnerHTML={{\n      __html: renderContent(text)\n    }}\n  />\n);\n\nexport default App;\n"]}
+{"version":3,"sources":["../../../src/components/RenderText/index.js"],"names":["App","__html","text"],"mappings":";;;;;;AAAA;;;;AACA;;;;AAEA,IAAMA,MAAM,SAANA,GAAM;AAAA,SACV;AACE,eAAU,sBADZ;AAEE,6BAAyB;AACvBC,cAAQ,2BAAcC,IAAd;AADe;AAF3B,IADU;AAAA,CAAZ;;kBASeF,G","file":"index.js","sourcesContent":["import React from \"react\";\r\nimport { renderContent } from \"../../helper\";\r\n\r\nconst App = text => (\r\n  <div\r\n    className=\"comment-item-content\"\r\n    dangerouslySetInnerHTML={{\r\n      __html: renderContent(text)\r\n    }}\r\n  />\r\n);\r\n\r\nexport default App;\r\n"]}

lib/constant.js.map

-{"version":3,"sources":["../src/constant.js"],"names":["ERROR_DEFAULT","LIMIT","OSS_ENDPOINT","OSS_BUCKET","DRIVER_LICENSE_PATH","OSS_LINK","MAX_UPLOAD_NUMBER","URL_REGEXP","REGEXP","AVATAR","IMAGE_SPLIT","IMAGE_PROCESS","IMAGE_PROCESS_SMALL","IMAGE_PROCESS_LARGE","COMMENT_TYPE","COMMENT","REPLY"],"mappings":";;;;;AAAO,IAAMA,wCAAgB,MAAtB;;AAEA,IAAMC,wBAAQ,EAAd,C,CAAkB;;AAElB,IAAMC,sCAAe,6BAArB;AACA,IAAMC,kCAAa,eAAnB;AACA,IAAMC,oDAAsB,UAA5B;;AAEA,IAAMC,8BAAW,6CAAjB;;AAEA,IAAMC,gDAAoB,CAA1B;;AAEA,IAAMC,kCAAa,oGAAnB;;AAEA,IAAMC,0BAAS,eAAf;;AAEA,IAAMC,0BAAS,EAAf;;AAEA,IAAMC,oCAAc,aAApB;;AAEA,IAAMC,wCAAgB,mCAAtB;AACA,IAAMC,oDAAsB,mCAA5B;AACA,IAAMC,oDAAsB,mCAA5B;;AAEA,IAAMC,sCAAe;AAC1BC,WAAS,SADiB;AAE1BC,SAAO;AAFmB,CAArB","file":"constant.js","sourcesContent":["export const ERROR_DEFAULT = \"出错了！\";\n\nexport const LIMIT = 10; // 默认 limit\n\nexport const OSS_ENDPOINT = \"oss-cn-beijing.aliyuncs.com\";\nexport const OSS_BUCKET = \"links-comment\";\nexport const DRIVER_LICENSE_PATH = \"/comment\";\n\nexport const OSS_LINK = \"//links-comment.oss-cn-beijing.aliyuncs.com\";\n\nexport const MAX_UPLOAD_NUMBER = 4;\n\nexport const URL_REGEXP = /((http(s)?:)?\\/\\/)?(www\\.)?[-a-zA-Z0-9@:%._+~#=]{2,256}\\.[a-z]{2,6}\\b([-a-zA-Z0-9@:%_+.~#?&//=]*)/g;\n\nexport const REGEXP = /\\[[^[\\]]+?\\]/g;\n\nexport const AVATAR = \"\";\n\nexport const IMAGE_SPLIT = \"IMAGE_SPLIT\";\n\nexport const IMAGE_PROCESS = \"?x-oss-process=image/resize,h_350\";\nexport const IMAGE_PROCESS_SMALL = \"?x-oss-process=image/resize,h_100\";\nexport const IMAGE_PROCESS_LARGE = \"?x-oss-process=image/resize,h_500\";\n\nexport const COMMENT_TYPE = {\n  COMMENT: \"comment\",\n  REPLY: \"reply\"\n};\n"]}
+{"version":3,"sources":["../src/constant.js"],"names":["ERROR_DEFAULT","LIMIT","OSS_ENDPOINT","OSS_BUCKET","DRIVER_LICENSE_PATH","OSS_LINK","MAX_UPLOAD_NUMBER","URL_REGEXP","REGEXP","AVATAR","IMAGE_SPLIT","IMAGE_PROCESS","IMAGE_PROCESS_SMALL","IMAGE_PROCESS_LARGE","COMMENT_TYPE","COMMENT","REPLY"],"mappings":";;;;;AAAO,IAAMA,wCAAgB,MAAtB;;AAEA,IAAMC,wBAAQ,EAAd,C,CAAkB;;AAElB,IAAMC,sCAAe,6BAArB;AACA,IAAMC,kCAAa,eAAnB;AACA,IAAMC,oDAAsB,UAA5B;;AAEA,IAAMC,8BAAW,6CAAjB;;AAEA,IAAMC,gDAAoB,CAA1B;;AAEA,IAAMC,kCAAa,oGAAnB;;AAEA,IAAMC,0BAAS,eAAf;;AAEA,IAAMC,0BAAS,EAAf;;AAEA,IAAMC,oCAAc,aAApB;;AAEA,IAAMC,wCAAgB,mCAAtB;AACA,IAAMC,oDAAsB,mCAA5B;AACA,IAAMC,oDAAsB,mCAA5B;;AAEA,IAAMC,sCAAe;AAC1BC,WAAS,SADiB;AAE1BC,SAAO;AAFmB,CAArB","file":"constant.js","sourcesContent":["export const ERROR_DEFAULT = \"出错了！\";\r\n\r\nexport const LIMIT = 10; // 默认 limit\r\n\r\nexport const OSS_ENDPOINT = \"oss-cn-beijing.aliyuncs.com\";\r\nexport const OSS_BUCKET = \"links-comment\";\r\nexport const DRIVER_LICENSE_PATH = \"/comment\";\r\n\r\nexport const OSS_LINK = \"//links-comment.oss-cn-beijing.aliyuncs.com\";\r\n\r\nexport const MAX_UPLOAD_NUMBER = 4;\r\n\r\nexport const URL_REGEXP = /((http(s)?:)?\\/\\/)?(www\\.)?[-a-zA-Z0-9@:%._+~#=]{2,256}\\.[a-z]{2,6}\\b([-a-zA-Z0-9@:%_+.~#?&//=]*)/g;\r\n\r\nexport const REGEXP = /\\[[^[\\]]+?\\]/g;\r\n\r\nexport const AVATAR = \"\";\r\n\r\nexport const IMAGE_SPLIT = \"IMAGE_SPLIT\";\r\n\r\nexport const IMAGE_PROCESS = \"?x-oss-process=image/resize,h_350\";\r\nexport const IMAGE_PROCESS_SMALL = \"?x-oss-process=image/resize,h_100\";\r\nexport const IMAGE_PROCESS_LARGE = \"?x-oss-process=image/resize,h_500\";\r\n\r\nexport const COMMENT_TYPE = {\r\n  COMMENT: \"comment\",\r\n  REPLY: \"reply\"\r\n};\r\n"]}

lib/index.js

 
 window.renderComment = renderComment;
 
+renderComment({
+  id: "root-comment",
+  type: 1,
+  businessId: "test"
+});
+
 // renderComment({
 //   id: "root-comment",
 //   type: 1,

lib/index.js.map

-{"version":3,"sources":["../src/index.js"],"names":["Index","props","renderComment","config","id","Error","type","businessId","console","warn","API","userId","ReactDOM","render","document","getElementById","window"],"mappings":";;;;AAAA;;;;AACA;;;;AACA;;;;;;AACA;;AAEA,IAAMA,QAAQ,SAARA,KAAQ;AAAA,SACZ;AAAC,iBAAD;AAAA,eAAK,sBAAL,EAAsB,oBAAtB,EAAqC,oBAArC,EAAoD,eAApD,IAAkEC,KAAlE;AACE,kCAAC,WAAD,IAAQ,WAAW,CAAnB,EAAsB,eAAtB;AADF,GADY;AAAA,CAAd;;AAMA;;;;;;;;AAQA,SAASC,aAAT,CAAuBC,MAAvB,EAA+B;AAC7B,MAAI,CAACA,OAAOC,EAAZ,EAAgB;AACd,UAAM,IAAIC,KAAJ,CAAU,gBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOG,IAAZ,EAAkB;AAChB,UAAM,IAAID,KAAJ,CAAU,kBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOI,UAAZ,EAAwB;AACtB;AACAC,YAAQC,IAAR,CAAa,+BAAb;AACD;AACD,MAAI,CAACN,OAAOO,GAAZ,EAAiB;AACf;AACAF,YAAQC,IAAR,CACE,sDADF;AAGD;AAhB4B,MAkB3BL,EAlB2B,GAuBzBD,MAvByB,CAkB3BC,EAlB2B;AAAA,qBAuBzBD,MAvByB,CAmB3BG,IAnB2B;AAAA,MAmB3BA,IAnB2B,gCAmBpB,CAnBoB;AAAA,2BAuBzBH,MAvByB,CAoB3BI,UApB2B;AAAA,MAoB3BA,UApB2B,sCAoBd,MApBc;AAAA,oBAuBzBJ,MAvByB,CAqB3BO,GArB2B;AAAA,MAqB3BA,GArB2B,+BAqBrB,oCArBqB;AAAA,MAsB3BC,MAtB2B,GAuBzBR,MAvByB,CAsB3BQ,MAtB2B;;;AAyB7BC,qBAASC,MAAT,CACE,8BAAC,KAAD,IAAO,MAAMP,IAAb,EAAmB,YAAYC,UAA/B,EAA2C,KAAKG,GAAhD,EAAqD,QAAQC,MAA7D,GADF,EAEEG,SAASC,cAAT,CAAwBX,EAAxB,CAFF;AAIA;AACD;;AAEDY,OAAOd,aAAP,GAAuBA,aAAvB;;AAEA;AACA;AACA;AACA;AACA;AACA","file":"index.js","sourcesContent":["import React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport App, { Editor } from \"./App\";\n// import registerServiceWorker from \"./registerServiceWorker\";\n\nconst Index = props => (\n  <App showAlertComment showAlertReply showAlertFavor showError {...props}>\n    <Editor maxUpload={9} autoFocus />\n  </App>\n);\n\n/**\n * 渲染评论组件\n * @param {object} config 编辑器配置\n *  - {string} id 渲染评论的DOM的 ID\n *  - {number} type 评论的 type\n *  - {string} businessId 评论的 businessId\n *  - {string} API, API 前缀, 默认 http://api.links123.net/comment/v1\n */\nfunction renderComment(config) {\n  if (!config.id) {\n    throw new Error(\"id is required\");\n  }\n  if (!config.type) {\n    throw new Error(\"type is required\");\n  }\n  if (!config.businessId) {\n    // throw new Error(\"businessId is required\");\n    console.warn(\"没有传入 businessId 参数，默认使用: test\");\n  }\n  if (!config.API) {\n    // throw new Error(\"API is required\");\n    console.warn(\n      \"没有传入 API 参数，默认使用: http://api.links123.net/comment/v1\"\n    );\n  }\n  const {\n    id,\n    type = 1,\n    businessId = \"test\",\n    API = \"http://api.links123.net/comment/v1\",\n    userId\n  } = config;\n\n  ReactDOM.render(\n    <Index type={type} businessId={businessId} API={API} userId={userId} />,\n    document.getElementById(id)\n  );\n  // registerServiceWorker();\n}\n\nwindow.renderComment = renderComment;\n\n// renderComment({\n//   id: \"root-comment\",\n//   type: 1,\n//   businessId: \"test\",\n//   API: 'http://api.links123.net/comment/v1',\n// });\n"]}
+{"version":3,"sources":["../src/index.js"],"names":["Index","props","renderComment","config","id","Error","type","businessId","console","warn","API","userId","ReactDOM","render","document","getElementById","window"],"mappings":";;;;AAAA;;;;AACA;;;;AACA;;;;;;AACA;;AAEA,IAAMA,QAAQ,SAARA,KAAQ;AAAA,SACZ;AAAC,iBAAD;AAAA,eAAK,sBAAL,EAAsB,oBAAtB,EAAqC,oBAArC,EAAoD,eAApD,IAAkEC,KAAlE;AACE,kCAAC,WAAD,IAAQ,WAAW,CAAnB,EAAsB,eAAtB;AADF,GADY;AAAA,CAAd;;AAMA;;;;;;;;AAQA,SAASC,aAAT,CAAuBC,MAAvB,EAA+B;AAC7B,MAAI,CAACA,OAAOC,EAAZ,EAAgB;AACd,UAAM,IAAIC,KAAJ,CAAU,gBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOG,IAAZ,EAAkB;AAChB,UAAM,IAAID,KAAJ,CAAU,kBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOI,UAAZ,EAAwB;AACtB;AACAC,YAAQC,IAAR,CAAa,+BAAb;AACD;AACD,MAAI,CAACN,OAAOO,GAAZ,EAAiB;AACf;AACAF,YAAQC,IAAR,CACE,sDADF;AAGD;AAhB4B,MAkB3BL,EAlB2B,GAuBzBD,MAvByB,CAkB3BC,EAlB2B;AAAA,qBAuBzBD,MAvByB,CAmB3BG,IAnB2B;AAAA,MAmB3BA,IAnB2B,gCAmBpB,CAnBoB;AAAA,2BAuBzBH,MAvByB,CAoB3BI,UApB2B;AAAA,MAoB3BA,UApB2B,sCAoBd,MApBc;AAAA,oBAuBzBJ,MAvByB,CAqB3BO,GArB2B;AAAA,MAqB3BA,GArB2B,+BAqBrB,oCArBqB;AAAA,MAsB3BC,MAtB2B,GAuBzBR,MAvByB,CAsB3BQ,MAtB2B;;;AAyB7BC,qBAASC,MAAT,CACE,8BAAC,KAAD,IAAO,MAAMP,IAAb,EAAmB,YAAYC,UAA/B,EAA2C,KAAKG,GAAhD,EAAqD,QAAQC,MAA7D,GADF,EAEEG,SAASC,cAAT,CAAwBX,EAAxB,CAFF;AAIA;AACD;;AAEDY,OAAOd,aAAP,GAAuBA,aAAvB;;AAEAA,cAAc;AACZE,MAAI,cADQ;AAEZE,QAAM,CAFM;AAGZC,cAAY;AAHA,CAAd;;AAMA;AACA;AACA;AACA;AACA;AACA","file":"index.js","sourcesContent":["import React from \"react\";\r\nimport ReactDOM from \"react-dom\";\r\nimport App, { Editor } from \"./App\";\r\n// import registerServiceWorker from \"./registerServiceWorker\";\r\n\r\nconst Index = props => (\r\n  <App showAlertComment showAlertReply showAlertFavor showError {...props}>\r\n    <Editor maxUpload={9} autoFocus />\r\n  </App>\r\n);\r\n\r\n/**\r\n * 渲染评论组件\r\n * @param {object} config 编辑器配置\r\n *  - {string} id 渲染评论的DOM的 ID\r\n *  - {number} type 评论的 type\r\n *  - {string} businessId 评论的 businessId\r\n *  - {string} API, API 前缀, 默认 http://api.links123.net/comment/v1\r\n */\r\nfunction renderComment(config) {\r\n  if (!config.id) {\r\n    throw new Error(\"id is required\");\r\n  }\r\n  if (!config.type) {\r\n    throw new Error(\"type is required\");\r\n  }\r\n  if (!config.businessId) {\r\n    // throw new Error(\"businessId is required\");\r\n    console.warn(\"没有传入 businessId 参数，默认使用: test\");\r\n  }\r\n  if (!config.API) {\r\n    // throw new Error(\"API is required\");\r\n    console.warn(\r\n      \"没有传入 API 参数，默认使用: http://api.links123.net/comment/v1\"\r\n    );\r\n  }\r\n  const {\r\n    id,\r\n    type = 1,\r\n    businessId = \"test\",\r\n    API = \"http://api.links123.net/comment/v1\",\r\n    userId\r\n  } = config;\r\n\r\n  ReactDOM.render(\r\n    <Index type={type} businessId={businessId} API={API} userId={userId} />,\r\n    document.getElementById(id)\r\n  );\r\n  // registerServiceWorker();\r\n}\r\n\r\nwindow.renderComment = renderComment;\r\n\r\nrenderComment({\r\n  id: \"root-comment\",\r\n  type: 1,\r\n  businessId: \"test\"\r\n});\r\n\r\n// renderComment({\r\n//   id: \"root-comment\",\r\n//   type: 1,\r\n//   businessId: \"test\",\r\n//   API: 'http://api.links123.net/comment/v1',\r\n// });\r\n"]}

lib/lang/en-US.js

+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var USdata = {
+  "editor.alreadyEntered": "{count} words entered",
+  "editor.placeholder": "Say something",
+  "editor.maxLength": "Maximum {maxLength} words",
+  "editor.SubmitBtn": "Send",
+  "editor.uploadTip": "Upload pictures",
+  "editor.uploadCount": "(You could upload {count} more)",
+  "editor.uploadBtn": "Upload",
+
+  "comment.tourist": "Visitor",
+  "comment.totalComment": "Total {total, plural, =1 {one comment} other {# comments}}",
+  "comment.reply": "Reply",
+  "comment.moreComment": "More comments",
+
+  "reply.totalReply": "Total {total, plural, =1 {one reply} other {# replies}}",
+  "reply.moreReply": "More replies",
+  "reply.collapse": "Fold replies",
+
+  "picture.collapse": "Fold",
+  "picture.viewOriginal": "See the original",
+
+  "popConfirm.title": "Delete?",
+  "popConfirm.ok": "Confirm",
+  "popConfirm.cancel": "Cancel",
+  "popConfirm.delete": "Delete",
+
+  "message.noMoreComment": "No more comments",
+  "message.noMoreData": "No more data",
+  "message.notNull": "It's still empty",
+  "message.success": "Comments sent",
+  "message.replyNoNull": "It's still empty",
+  "message.replySuccess": "Reply sent",
+  "message.cancelLickSuccess": "Unliked",
+  "message.likeSuccess": "Liked"
+};
+
+exports.default = USdata;
+//# sourceMappingURL=en-US.js.map

lib/lang/en-US.js.map

+{"version":3,"sources":["../../src/lang/en-US.js"],"names":["USdata"],"mappings":";;;;;AAAA,IAAMA,SAAS;AACb,2BAAyB,uBADZ;AAEb,wBAAsB,eAFT;AAGb,sBAAoB,2BAHP;AAIb,sBAAoB,MAJP;AAKb,sBAAoB,iBALP;AAMb,wBAAsB,iCANT;AAOb,sBAAoB,QAPP;;AASb,qBAAmB,SATN;AAUb,0BAAwB,4DAVX;AAWb,mBAAiB,OAXJ;AAYb,yBAAuB,eAZV;;AAcb,sBAAoB,yDAdP;AAeb,qBAAmB,cAfN;AAgBb,oBAAkB,cAhBL;;AAkBb,sBAAoB,MAlBP;AAmBb,0BAAwB,kBAnBX;;AAqBb,sBAAoB,SArBP;AAsBb,mBAAiB,SAtBJ;AAuBb,uBAAqB,QAvBR;AAwBb,uBAAqB,QAxBR;;AA0Bb,2BAAyB,kBA1BZ;AA2Bb,wBAAsB,cA3BT;AA4Bb,qBAAmB,kBA5BN;AA6Bb,qBAAmB,eA7BN;AA8Bb,yBAAuB,kBA9BV;AA+Bb,0BAAwB,YA/BX;AAgCb,+BAA6B,SAhChB;AAiCb,yBAAuB;AAjCV,CAAf;;kBAoCeA,M","file":"en-US.js","sourcesContent":["const USdata = {\r\n  \"editor.alreadyEntered\": \"{count} words entered\",\r\n  \"editor.placeholder\": \"Say something\",\r\n  \"editor.maxLength\": \"Maximum {maxLength} words\",\r\n  \"editor.SubmitBtn\": \"Send\",\r\n  \"editor.uploadTip\": \"Upload pictures\",\r\n  \"editor.uploadCount\": \"(You could upload {count} more)\",\r\n  \"editor.uploadBtn\": \"Upload\",\r\n\r\n  \"comment.tourist\": \"Visitor\",\r\n  \"comment.totalComment\": \"Total {total, plural, =1 {one comment} other {# comments}}\",\r\n  \"comment.reply\": \"Reply\",\r\n  \"comment.moreComment\": \"More comments\",\r\n\r\n  \"reply.totalReply\": \"Total {total, plural, =1 {one reply} other {# replies}}\",\r\n  \"reply.moreReply\": \"More replies\",\r\n  \"reply.collapse\": \"Fold replies\",\r\n\r\n  \"picture.collapse\": \"Fold\",\r\n  \"picture.viewOriginal\": \"See the original\",\r\n\r\n  \"popConfirm.title\": \"Delete?\",\r\n  \"popConfirm.ok\": \"Confirm\",\r\n  \"popConfirm.cancel\": \"Cancel\",\r\n  \"popConfirm.delete\": \"Delete\",\r\n\r\n  \"message.noMoreComment\": \"No more comments\",\r\n  \"message.noMoreData\": \"No more data\",\r\n  \"message.notNull\": \"It's still empty\",\r\n  \"message.success\": \"Comments sent\",\r\n  \"message.replyNoNull\": \"It's still empty\",\r\n  \"message.replySuccess\": \"Reply sent\",\r\n  \"message.cancelLickSuccess\": \"Unliked\",\r\n  \"message.likeSuccess\": \"Liked\"\r\n};\r\n\r\nexport default USdata;\r\n"]}

lib/lang/index.js

 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-// 语言包
-// 英文短语和中文提示的对应
-var data = {
-  "not found": "没有数据",
-  "auth failed": "请先登录",
-  "create comment failed": "创建评论失败",
-  "comment favor failed": "评论点赞失败",
-  "delete comment favor failed": "评论取消点赞失败",
-  "get comments failed": "获取评论列表失败",
-  "create reply failed": "创建回复失败",
-  "reply favor failed": "回复点赞失败",
-  "delete reply favor failed": "删除回复点赞失败",
-  "get replies failed": "获取回复列表失败"
-};
+/**
+ * 当前支持的语言
+ */
+var SUPPORT_LOCALES = exports.SUPPORT_LOCALES = [{
+  name: "English",
+  value: "en-US"
+}, {
+  name: "简体中文",
+  value: "zh-CN"
+}];
 
-exports.default = data;
+// 服务端返回的英文短语和中文提示的对应
+var LOCALES_RESPONSE = exports.LOCALES_RESPONSE = {
+  "zh-CN": {
+    "not found": "没有数据",
+    "auth failed": "请先登录",
+    "create comment failed": "评论未发送",
+    "comment favor failed": "点赞失败",
+    "delete comment favor failed": "取消点赞失败",
+    "get comments failed": "评论加载失败",
+    "create reply failed": "回复失败",
+    "reply favor failed": "点赞失败",
+    "delete reply favor failed": "取消点赞失败",
+    "get replies failed": "回复加载失败"
+  },
+  "en-US": {
+    "not found": "No data",
+    "auth failed": "Please Login",
+    "create comment failed": "Comments not sent",
+    "comment favor failed": "Liking failed",
+    "delete comment favor failed": "Unliking failed",
+    "get comments failed": "Comments loading failed",
+    "create reply failed": "Replying failed",
+    "reply favor failed": "Liking failed",
+    "delete reply favor failed": "Unliking failed",
+    "get replies failed": "Loading of replies failed"
+  }
+};
 //# sourceMappingURL=index.js.map

lib/lang/index.js.map

-{"version":3,"sources":["../../src/lang/index.js"],"names":["data"],"mappings":";;;;;AAAA;AACA;AACA,IAAMA,OAAO;AACX,eAAa,MADF;AAEX,iBAAe,MAFJ;AAGX,2BAAyB,QAHd;AAIX,0BAAwB,QAJb;AAKX,iCAA+B,UALpB;AAMX,yBAAuB,UANZ;AAOX,yBAAuB,QAPZ;AAQX,wBAAsB,QARX;AASX,+BAA6B,UATlB;AAUX,wBAAsB;AAVX,CAAb;;kBAaeA,I","file":"index.js","sourcesContent":["// 语言包\n// 英文短语和中文提示的对应\nconst data = {\n  \"not found\": \"没有数据\",\n  \"auth failed\": \"请先登录\",\n  \"create comment failed\": \"创建评论失败\",\n  \"comment favor failed\": \"评论点赞失败\",\n  \"delete comment favor failed\": \"评论取消点赞失败\",\n  \"get comments failed\": \"获取评论列表失败\",\n  \"create reply failed\": \"创建回复失败\",\n  \"reply favor failed\": \"回复点赞失败\",\n  \"delete reply favor failed\": \"删除回复点赞失败\",\n  \"get replies failed\": \"获取回复列表失败\"\n};\n\nexport default data;\n"]}
+{"version":3,"sources":["../../src/lang/index.js"],"names":["SUPPORT_LOCALES","name","value","LOCALES_RESPONSE"],"mappings":";;;;;AAAA;;;AAGO,IAAMA,4CAAkB,CAC7B;AACEC,QAAM,SADR;AAEEC,SAAO;AAFT,CAD6B,EAK7B;AACED,QAAM,MADR;AAEEC,SAAO;AAFT,CAL6B,CAAxB;;AAWP;AACO,IAAMC,8CAAmB;AAC9B,WAAS;AACP,iBAAa,MADN;AAEP,mBAAe,MAFR;AAGP,6BAAyB,OAHlB;AAIP,4BAAwB,MAJjB;AAKP,mCAA+B,QALxB;AAMP,2BAAuB,QANhB;AAOP,2BAAuB,MAPhB;AAQP,0BAAsB,MARf;AASP,iCAA6B,QATtB;AAUP,0BAAsB;AAVf,GADqB;AAa9B,WAAS;AACP,iBAAa,SADN;AAEP,mBAAe,cAFR;AAGP,6BAAyB,mBAHlB;AAIP,4BAAwB,eAJjB;AAKP,mCAA+B,iBALxB;AAMP,2BAAuB,yBANhB;AAOP,2BAAuB,iBAPhB;AAQP,0BAAsB,eARf;AASP,iCAA6B,iBATtB;AAUP,0BAAsB;AAVf;AAbqB,CAAzB","file":"index.js","sourcesContent":["/**\r\n * 当前支持的语言\r\n */\r\nexport const SUPPORT_LOCALES = [\r\n  {\r\n    name: \"English\",\r\n    value: \"en-US\"\r\n  },\r\n  {\r\n    name: \"简体中文\",\r\n    value: \"zh-CN\"\r\n  }\r\n];\r\n\r\n// 服务端返回的英文短语和中文提示的对应\r\nexport const LOCALES_RESPONSE = {\r\n  \"zh-CN\": {\r\n    \"not found\": \"没有数据\",\r\n    \"auth failed\": \"请先登录\",\r\n    \"create comment failed\": \"评论未发送\",\r\n    \"comment favor failed\": \"点赞失败\",\r\n    \"delete comment favor failed\": \"取消点赞失败\",\r\n    \"get comments failed\": \"评论加载失败\",\r\n    \"create reply failed\": \"回复失败\",\r\n    \"reply favor failed\": \"点赞失败\",\r\n    \"delete reply favor failed\": \"取消点赞失败\",\r\n    \"get replies failed\": \"回复加载失败\"\r\n  },\r\n  \"en-US\": {\r\n    \"not found\": \"No data\",\r\n    \"auth failed\": \"Please Login\",\r\n    \"create comment failed\": \"Comments not sent\",\r\n    \"comment favor failed\": \"Liking failed\",\r\n    \"delete comment favor failed\": \"Unliking failed\",\r\n    \"get comments failed\": \"Comments loading failed\",\r\n    \"create reply failed\": \"Replying failed\",\r\n    \"reply favor failed\": \"Liking failed\",\r\n    \"delete reply favor failed\": \"Unliking failed\",\r\n    \"get replies failed\": \"Loading of replies failed\"\r\n  }\r\n};\r\n"]}

lib/lang/zh-CN.js

+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var CNdata = {
+  "editor.alreadyEntered": "已输入{count}/140字",
+  "editor.placeholder": "说点什么吧...",
+  "editor.maxLength": "字数上限{maxLength}",
+  "editor.SubmitBtn": "发送",
+  "editor.uploadTip": "上传图片",
+  "editor.uploadCount": "(您还能上传{count}张图片)",
+  "editor.uploadBtn": "上传",
+
+  "comment.tourist": "游客",
+  "comment.totalComment": "共{total}条评论",
+  "comment.reply": "回复",
+  "comment.moreComment": "更多评论",
+
+  "reply.totalReply": "共{total}条回复",
+  "reply.moreReply": "更多回复",
+  "reply.collapse": "收起回复",
+
+  "picture.collapse": "收起",
+  "picture.viewOriginal": "查看原图",
+
+  "popConfirm.title": "确定要删除吗",
+  "popConfirm.ok": "确定",
+  "popConfirm.cancel": "取消",
+  "popConfirm.delete": "删除",
+
+  "message.noMoreComment": "没有更多评论了",
+  "message.noMoreData": "没有更多数据了！",
+  "message.notNull": "没写内容呢",
+  "message.success": "评论已发送！",
+  "message.replyNoNull": "没写内容呢",
+  "message.replySuccess": "回复已发送！",
+  "message.cancelLickSuccess": "已取消点赞！",
+  "message.likeSuccess": "已赞！"
+};
+
+exports.default = CNdata;
+//# sourceMappingURL=zh-CN.js.map

lib/lang/zh-CN.js.map

+{"version":3,"sources":["../../src/lang/zh-CN.js"],"names":["CNdata"],"mappings":";;;;;AAAA,IAAMA,SAAS;AACb,2BAAyB,iBADZ;AAEb,wBAAsB,UAFT;AAGb,sBAAoB,iBAHP;AAIb,sBAAoB,IAJP;AAKb,sBAAoB,MALP;AAMb,wBAAsB,mBANT;AAOb,sBAAoB,IAPP;;AASb,qBAAmB,IATN;AAUb,0BAAwB,aAVX;AAWb,mBAAiB,IAXJ;AAYb,yBAAuB,MAZV;;AAcb,sBAAoB,aAdP;AAeb,qBAAmB,MAfN;AAgBb,oBAAkB,MAhBL;;AAkBb,sBAAoB,IAlBP;AAmBb,0BAAwB,MAnBX;;AAqBb,sBAAoB,QArBP;AAsBb,mBAAiB,IAtBJ;AAuBb,uBAAqB,IAvBR;AAwBb,uBAAqB,IAxBR;;AA0Bb,2BAAyB,SA1BZ;AA2Bb,wBAAsB,UA3BT;AA4Bb,qBAAmB,OA5BN;AA6Bb,qBAAmB,QA7BN;AA8Bb,yBAAuB,OA9BV;AA+Bb,0BAAwB,QA/BX;AAgCb,+BAA6B,QAhChB;AAiCb,yBAAuB;AAjCV,CAAf;;kBAoCeA,M","file":"zh-CN.js","sourcesContent":["const CNdata = {\r\n  \"editor.alreadyEntered\": \"已输入{count}/140字\",\r\n  \"editor.placeholder\": \"说点什么吧...\",\r\n  \"editor.maxLength\": \"字数上限{maxLength}\",\r\n  \"editor.SubmitBtn\": \"发送\",\r\n  \"editor.uploadTip\": \"上传图片\",\r\n  \"editor.uploadCount\": \"(您还能上传{count}张图片)\",\r\n  \"editor.uploadBtn\": \"上传\",\r\n\r\n  \"comment.tourist\": \"游客\",\r\n  \"comment.totalComment\": \"共{total}条评论\",\r\n  \"comment.reply\": \"回复\",\r\n  \"comment.moreComment\": \"更多评论\",\r\n\r\n  \"reply.totalReply\": \"共{total}条回复\",\r\n  \"reply.moreReply\": \"更多回复\",\r\n  \"reply.collapse\": \"收起回复\",\r\n\r\n  \"picture.collapse\": \"收起\",\r\n  \"picture.viewOriginal\": \"查看原图\",\r\n\r\n  \"popConfirm.title\": \"确定要删除吗\",\r\n  \"popConfirm.ok\": \"确定\",\r\n  \"popConfirm.cancel\": \"取消\",\r\n  \"popConfirm.delete\": \"删除\",\r\n\r\n  \"message.noMoreComment\": \"没有更多评论了\",\r\n  \"message.noMoreData\": \"没有更多数据了！\",\r\n  \"message.notNull\": \"没写内容呢\",\r\n  \"message.success\": \"评论已发送！\",\r\n  \"message.replyNoNull\": \"没写内容呢\",\r\n  \"message.replySuccess\": \"回复已发送！\",\r\n  \"message.cancelLickSuccess\": \"已取消点赞！\",\r\n  \"message.likeSuccess\": \"已赞！\"\r\n};\r\n\r\nexport default CNdata;\r\n"]}

lib/mock.js

-'use strict';
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var comments = exports.comments = {
-  list: [{
-    id: '5b3a4f0973df3e6a32b0a9d2',
-    user_id: 0,
-    user_name: '',
-    user_avatar: '',
-    content: 'test[微笑]',
-    replies: [{
-      id: '5b3c58c473df3e64d8d53afb',
-      user_id: 0,
-      user_name: '',
-      user_avatar: '',
-      reply: null,
-      content: 'test',
-      favor_count: 1,
-      favored: false,
-      created: 1530681540
-    }, {
-      id: '5b3c58c473df3e64d8d53afa',
-      user_id: 0,
-      user_name: '',
-      user_avatar: '',
-      reply: {
-        id: '5b3c58c473df3e64d8d53afb',
-        user_id: 0,
-        user_name: '',
-        user_avatar: '',
-        reply: null,
-        content: 'test',
-        favor_count: 1,
-        favored: false,
-        created: 1530681540
-      },
-      content: 'test',
-      favor_count: 2,
-      favored: false,
-      created: 1530681540
-    }, {
-      id: '5b3c6e4873df3e53f870d912',
-      user_id: 0,
-      user_name: '',
-      user_avatar: '',
-      reply: {
-        id: '5b3c58c473df3e64d8d53afb',
-        user_id: 0,
-        user_name: '',
-        user_avatar: '',
-        reply: null,
-        content: 'test',
-        favor_count: 1,
-        favored: false,
-        created: 1530681540
-      },
-      content: 'test',
-      favor_count: 0,
-      favored: false,
-      created: 1530687048
-    }],
-    reply_count: 4,
-    favor_count: 0,
-    favored: false,
-    created: 1530547977
-  }],
-  total: 1,
-  page: 1
-};
-//# sourceMappingURL=mock.js.map

lib/mock.js.map

-{"version":3,"sources":["../src/mock.js"],"names":["comments","list","id","user_id","user_name","user_avatar","content","replies","reply","favor_count","favored","created","reply_count","total","page"],"mappings":";;;;;AAAO,IAAMA,8BAAW;AACtBC,QAAM,CACJ;AACEC,QAAI,0BADN;AAEEC,aAAS,CAFX;AAGEC,eAAW,EAHb;AAIEC,iBAAa,EAJf;AAKEC,aAAS,UALX;AAMEC,aAAS,CACP;AACEL,UAAI,0BADN;AAEEC,eAAS,CAFX;AAGEC,iBAAW,EAHb;AAIEC,mBAAa,EAJf;AAKEG,aAAO,IALT;AAMEF,eAAS,MANX;AAOEG,mBAAa,CAPf;AAQEC,eAAS,KARX;AASEC,eAAS;AATX,KADO,EAYP;AACET,UAAI,0BADN;AAEEC,eAAS,CAFX;AAGEC,iBAAW,EAHb;AAIEC,mBAAa,EAJf;AAKEG,aAAO;AACLN,YAAI,0BADC;AAELC,iBAAS,CAFJ;AAGLC,mBAAW,EAHN;AAILC,qBAAa,EAJR;AAKLG,eAAO,IALF;AAMLF,iBAAS,MANJ;AAOLG,qBAAa,CAPR;AAQLC,iBAAS,KARJ;AASLC,iBAAS;AATJ,OALT;AAgBEL,eAAS,MAhBX;AAiBEG,mBAAa,CAjBf;AAkBEC,eAAS,KAlBX;AAmBEC,eAAS;AAnBX,KAZO,EAiCP;AACET,UAAI,0BADN;AAEEC,eAAS,CAFX;AAGEC,iBAAW,EAHb;AAIEC,mBAAa,EAJf;AAKEG,aAAO;AACLN,YAAI,0BADC;AAELC,iBAAS,CAFJ;AAGLC,mBAAW,EAHN;AAILC,qBAAa,EAJR;AAKLG,eAAO,IALF;AAMLF,iBAAS,MANJ;AAOLG,qBAAa,CAPR;AAQLC,iBAAS,KARJ;AASLC,iBAAS;AATJ,OALT;AAgBEL,eAAS,MAhBX;AAiBEG,mBAAa,CAjBf;AAkBEC,eAAS,KAlBX;AAmBEC,eAAS;AAnBX,KAjCO,CANX;AA6DEC,iBAAa,CA7Df;AA8DEH,iBAAa,CA9Df;AA+DEC,aAAS,KA/DX;AAgEEC,aAAS;AAhEX,GADI,CADgB;AAqEtBE,SAAO,CArEe;AAsEtBC,QAAM;AAtEgB,CAAjB","file":"mock.js","sourcesContent":["export const comments = {\n  list: [\n    {\n      id: '5b3a4f0973df3e6a32b0a9d2',\n      user_id: 0,\n      user_name: '',\n      user_avatar: '',\n      content: 'test[微笑]',\n      replies: [\n        {\n          id: '5b3c58c473df3e64d8d53afb',\n          user_id: 0,\n          user_name: '',\n          user_avatar: '',\n          reply: null,\n          content: 'test',\n          favor_count: 1,\n          favored: false,\n          created: 1530681540,\n        },\n        {\n          id: '5b3c58c473df3e64d8d53afa',\n          user_id: 0,\n          user_name: '',\n          user_avatar: '',\n          reply: {\n            id: '5b3c58c473df3e64d8d53afb',\n            user_id: 0,\n            user_name: '',\n            user_avatar: '',\n            reply: null,\n            content: 'test',\n            favor_count: 1,\n            favored: false,\n            created: 1530681540,\n          },\n          content: 'test',\n          favor_count: 2,\n          favored: false,\n          created: 1530681540,\n        },\n        {\n          id: '5b3c6e4873df3e53f870d912',\n          user_id: 0,\n          user_name: '',\n          user_avatar: '',\n          reply: {\n            id: '5b3c58c473df3e64d8d53afb',\n            user_id: 0,\n            user_name: '',\n            user_avatar: '',\n            reply: null,\n            content: 'test',\n            favor_count: 1,\n            favored: false,\n            created: 1530681540,\n          },\n          content: 'test',\n          favor_count: 0,\n          favored: false,\n          created: 1530687048,\n        },\n      ],\n      reply_count: 4,\n      favor_count: 0,\n      favored: false,\n      created: 1530547977,\n    },\n  ],\n  total: 1,\n  page: 1,\n};\n"]}

package.json

 {
   "name": "comment",
-  "version": "0.5.14",
+  "version": "1.0.0",
   "main": "lib/App.js",
   "description": "通用评论",
   "keywords": [
     "prop-types": "^15.6.2",
     "react": "^16.4.1",
     "react-dom": "^16.4.1",
+    "react-intl-universal": "^1.15.2",
     "react-scripts": "1.1.4",
     "shortid": "^2.2.11"
   },

public/locales/en-US.json

+{
+  "editor.alreadyEntered": "已输入{count}/140字",
+  "editor.placeholder": "say...",
+  "editor.SubmitBtn": "Submit",
+  "editor.uploadTip": "上传图片",
+  "editor.uploadCount": "(您还能上传{count}张图片)",
+  "editor.uploadBtn": "upload",
+
+  "comment.totalComment": "共{total}条评论",
+  "comment.reply": "reply",
+  "comment.moreComment": "More",
+
+  "reply.totalReply": "{total}条回复",
+  "reply.moreReply": "More",
+  "reply.collapse": "收起回复",
+
+  "popConfirm.title": "Sure?",
+  "popConfirm.ok": "Ok",
+  "popConfirm.cancel": "Cancel",
+  "popConfirm.delete": "Delete"
+}

public/locales/zh-CN.json

+{
+  "editor.alreadyEntered": "已输入{count}/140字",
+  "editor.placeholder": "说点什么吧...",
+  "editor.SubmitBtn": "发表",
+  "editor.uploadTip": "上传图片",
+  "editor.uploadCount": "(您还能上传{count}张图片)",
+  "editor.uploadBtn": "上传",
+
+  "comment.totalComment": "共{total}条评论",
+  "comment.reply": "回复",
+  "comment.moreComment": "查看更多评论",
+
+  "reply.totalReply": "{total}条回复",
+  "reply.moreReply": "查看更多回复",
+  "reply.collapse": "收起回复",
+
+  "popConfirm.title": "确定要删除吗",
+  "popConfirm.ok": "确定",
+  "popConfirm.cancel": "取消",
+  "popConfirm.delete": "删除"
+}

src/App.js

 import PropTypes from "prop-types";
 import { message } from "antd";
 import axios from "axios";
+import intl from "react-intl-universal";
 import { ERROR_DEFAULT, LIMIT, COMMENT_TYPE } from "./constant";
 import { CommentContext } from "./Comment";
 import { isFunction } from "./helper";
 import CommentList from "./components/CommentList";
 import Editor from "./components/Editor";
 import RenderText from "./components/RenderText";
-import lang from "./lang";
+import { SUPPORT_LOCALES, LOCALES_RESPONSE } from "./lang";
+import USdata from "./lang/en-US.js";
+import CNdata from "./lang/zh-CN.js";
 import "./App.css";
-// import styles from "./App.module.css";
+
+const LOCALES = {
+  "zh-CN": CNdata,
+  "en-US": USdata
+};
 
 class App extends Component {
   constructor(props) {
       page: 1,
       total: 0,
       // 是否没有更多评论了
-      isNoMoreComment: false
+      isNoMoreComment: false,
+      initDone: false,
+      locale: "zh-CN"
     };
     this.handleChangeLoading = this.handleChangeLoading.bind(this);
     this.sCreateComment = this.sCreateComment.bind(this);
     }
   }
 
-  componentDidMount() {}
+  componentDidMount() {
+    this.loadLocales();
+  }
+
+  /**
+   * 加载语言包
+   * 只能根据url或者传入的props来确定加载哪个语言包
+   * 优先级：传入的props > url
+   */
+  loadLocales() {
+    let { locales: currentLocale } = this.props;
+    if (!currentLocale) {
+      currentLocale = intl.determineLocale({
+        urlLocaleKey: "lang"
+      });
+    }
+    currentLocale = SUPPORT_LOCALES.find(item => item.value === currentLocale)
+      ? currentLocale
+      : "zh-CN";
+    intl
+      .init({
+        currentLocale,
+        locales: {
+          [currentLocale]: LOCALES[currentLocale]
+        }
+      })
+      .then(() => {
+        this.setState({ initDone: true, locale: currentLocale });
+      });
+  }
 
   error(msg, info = {}) {
     if (this.props.showError) {
   }
 
   errorHandler(error) {
+    const { locale } = this.state;
+    const localResponse = LOCALES_RESPONSE[locale];
     if (error.response && error.response.data && error.response.data.msg) {
-      this.error(lang[error.response.data.msg] || ERROR_DEFAULT, {
+      this.error(localResponse[error.response.data.msg] || ERROR_DEFAULT, {
         response: error.response
       });
       return;
     }
-    this.error(lang[error.message] || ERROR_DEFAULT, {
+    this.error(localResponse[error.response.data.msg] || ERROR_DEFAULT, {
       response: error.response
     });
   }
             total
           });
         } else {
-          message.info("没有更多评论了");
+          message.info(intl.get("message.noMoreComment"));
           this.setState({
             isNoMoreComment: true
           });
       .get(`${API}/replies?comment_id=${commentId}&page=${page}&limit=${limit}`)
       .then(response => {
         if (!response.data.list) {
-          message.info("没有更多数据了！");
+          message.info(intl.get("message.noMoreData"));
         }
         const list = this.state.list.map(item => {
           if (item.id === commentId) {
    * @param {object} {content} comment content
    */
   sCreateComment({ content } = {}, cb) {
-    if (!content) return this.error("评论内容不能为空 ");
+    if (!content) return this.error(intl.get("message.notNull"));
     this.handleChangeLoading("sCreateComment", true);
     const { API, type, businessId } = this.props;
     this.axios(`${API}/comments`, {
     })
       .then(response => {
         if (this.props.showAlertComment) {
-          message.success("评论成功！");
+          message.success(intl.get("message.success"));
         }
         if (isFunction(cb)) cb();
         // 将数据写入到 list 中
    * @param {object} data { comment_id, content, [reply_id] }
    */
   sCreateReply(data, cb) {
-    if (!data.content) return this.error("回复内容不能为空 ");
+    if (!data.content) return this.error(intl.get("message.replyNoNull"));
     this.handleChangeLoading("sCreateReply", true);
     const { API } = this.props;
     this.axios(`${API}/replies`, {
     })
       .then(response => {
         if (this.props.showAlertReply) {
-          message.success("回复成功！");
+          message.success(intl.get("message.replySuccess"));
         }
         if (isFunction(cb)) cb();
         // 将数据写入到 list 中
     })
       .then(response => {
         if (this.props.showAlertFavor) {
-          message.success(favored ? "取消点赞成功！" : "点赞成功！");
+          message.success(
+            favored
+              ? intl.get("message.cancelLickSuccess")
+              : intl.get("message.likeSuccess")
+          );
         }
         // 更新 list 中的该项数据的 favored
         const list = this.state.list.map(item => {
       withCredentials: true
     })
       .then(response => {
-        message.success(favored ? "取消点赞成功！" : "点赞成功！");
+        message.success(
+          favored
+            ? intl.get("message.cancelLickSuccess")
+            : intl.get("message.likeSuccess")
+        );
         // 更新 list 中的该项数据的 favored
         const list = this.state.list.map(item => {
           if (item.id === commentId) {
     };
 
     return (
-      <CommentContext.Provider value={value}>
-        <div className="comment">
-          {this.props.showEditor && (
-            <CommentInput content={this.props.children} />
-          )}
-          {this.props.showList && (
-            <div style={{ marginTop: 20 }}>
-              <CommentList />
-            </div>
-          )}
-        </div>
-      </CommentContext.Provider>
+      this.state.initDone && (
+        <CommentContext.Provider value={value}>
+          <div className="comment">
+            {this.props.showEditor && (
+              <CommentInput content={this.props.children} />
+            )}
+            {this.props.showList && (
+              <div style={{ marginTop: 20 }}>
+                <CommentList />
+              </div>
+            )}
+          </div>
+        </CommentContext.Provider>
+      )
     );
   }
 }
   limit: PropTypes.number, // 一次加载评论数量
   onPageChange: PropTypes.func, // 页码变化回调
   onGetMoreBtnClick: PropTypes.func, // 点击查看更多按钮回调
-  onDelete: PropTypes.func
+  onDelete: PropTypes.func,
+  locales: PropTypes.string //  传入的语言环境， en-US/zh-CN
 };
 
 App.defaultProps = {

src/components/CommentBox/index.js

 import React, { Component } from "react";
 import PropTypes from "prop-types";
 import { Icon } from "antd";
+import intl from "react-intl-universal";
 import Comment from "../../Comment";
 import ContentItem from "./../ContentItem";
 import "./index.css";
                   action="replyToReply" // 回复的回复
                 />,
                 <div className="comment-more-box" key="show_more_button">
-                  {!isNoMoreReply &&
-                    replyCount !== len && (
-                      <span
-                        className="comment-show-more"
-                        onClick={() => this.handleGetMoreReply(commentId)}
-                      >
-                        查看更多回复
-                      </span>
-                    )}
+                  {!isNoMoreReply && replyCount !== len && (
+                    <span
+                      className="comment-show-more"
+                      onClick={() => this.handleGetMoreReply(commentId)}
+                    >
+                      {intl.get("reply.moreReply")}
+                    </span>
+                  )}
 
                   <a
                     style={{ float: "right" }}
                     onClick={this.handleToggleReply}
                   >
-                    <Icon type="up" /> 收起回复
+                    <Icon type="up" /> {intl.get("reply.collapse")}
                   </a>
                 </div>
               ];

src/components/CommentList/index.js

 import React, { Component } from "react";
 import { Spin, Pagination } from "antd";
+import intl from "react-intl-universal";
 import Comment from "../../Comment";
 import CommentBox from "../CommentBox";
 import "./index.css";
               onPageChange(page + 1);
             }}
           >
-            <span>查看更多评论</span>
+            <span>{intl.get("comment.moreComment")}</span>
           </div>
         );
       } else {
     return (
       <div>
         <Spin spinning={spinning}>
-          <div>共 {total} 条评论</div>
+          {/* <div>共 {total} 条评论</div> */}
+          <div>{intl.get("comment.totalComment", { total })}</div>
           {list.map(item => (
             <CommentBox content={item} key={item.id} commentId={item.id} />
           ))}

src/components/ContentItem/index.js

 import { Avatar, Icon, Tooltip, Popconfirm } from "antd";
 import dayjs from "dayjs";
 import "dayjs/locale/zh-cn";
+// import 'dayjs/locale/es';
 import relativeTime from "dayjs/plugin/relativeTime";
+import intl from "react-intl-universal";
 import Comment from "../../Comment";
 import CommentInput from "../CommentInput";
 import avatar from "../../avatar";
 import "./index.css";
 import ImagePreviewer from "../ImagePreviewer/ImagePreviewer";
 
-dayjs.locale("zh-cn");
+// dayjs.locale("zh-cn");
 dayjs.extend(relativeTime);
 
+const LOCALES = {
+  "zh-CN": "zh-cn"
+};
+
 class CommentItem extends Component {
   constructor(props) {
     super(props);
       app
     } = this.props;
 
+    const { locale } = this.props.app;
     const { showInput } = this.state;
 
     let newContent = content.content;
             {/* <a href={`/${content.user_id}`}>
               {content.user_name || "暂无昵称"}
             </a> */}
-            <strong>{content.user_name || "游客"}</strong>
+            <strong>{content.user_name || intl.get("comment.tourist")}</strong>
             <span style={{ marginLeft: 10 }}>
               <Tooltip
                 placement="top"
                   "YYYY-MM-DD HH:mm:ss"
                 )}
               >
-                {dayjs(content.created * 1000).fromNow()}
+                {LOCALES[locale]
+                  ? dayjs(content.created * 1000)
+                      .locale(LOCALES[locale])
+                      .fromNow()
+                  : dayjs(content.created * 1000).fromNow()}
               </Tooltip>
             </span>
           </div>
             }}
           />
           {// image为空时不渲染comment-item-image
-          imageList.length > 0 &&
-            imageList[0] !== "" && (
-              <div className="comment-item-image">
-                {!this.state.showPreviewer &&
-                  imgs.map((item, index) => {
-                    if (item.type === "divider") {
-                      return (
-                        <div className="comment-item-image-wrapper" key={index}>
-                          <div className="comment-img-divider" />
-                          {/* <img src={item} alt={item} className="comment-img" /> */}
-                        </div>
-                      );
-                    }
+          imageList.length > 0 && imageList[0] !== "" && (
+            <div className="comment-item-image">
+              {!this.state.showPreviewer &&
+                imgs.map((item, index) => {
+                  if (item.type === "divider") {
                     return (
-                      <div
-                        className="comment-item-image-wrapper"
-                        key={index}
-                        onClick={() => {
-                          let i = index;
-                          if (needClear) {
-                            if (index > 3) {
-                              i -= 1;
-                            }
-                            if (index > 7) {
-                              i -= 1;
-                            }
-                          }
-                          this.showPreviewer(i);
-                        }}
-                      >
-                        <div
-                          style={{ backgroundImage: `url(${item})` }}
-                          className="comment-img-thumbnail"
-                        />
+                      <div className="comment-item-image-wrapper" key={index}>
+                        <div className="comment-img-divider" />
                         {/* <img src={item} alt={item} className="comment-img" /> */}
                       </div>
                     );
-                  })}
-                {this.state.showPreviewer && (
-                  <ImagePreviewer
-                    list={imageList}
-                    index={this.state.previewerIndex}
-                    onFold={this.hidePreviewer}
-                  />
-                )}
-                <div className="clearfix" />
-              </div>
-            )}
+                  }
+                  return (
+                    <div
+                      className="comment-item-image-wrapper"
+                      key={index}
+                      onClick={() => {
+                        let i = index;
+                        if (needClear) {
+                          if (index > 3) {
+                            i -= 1;
+                          }
+                          if (index > 7) {
+                            i -= 1;
+                          }
+                        }
+                        this.showPreviewer(i);
+                      }}
+                    >
+                      <div
+                        style={{ backgroundImage: `url(${item})` }}
+                        className="comment-img-thumbnail"
+                      />
+                      {/* <img src={item} alt={item} className="comment-img" /> */}
+                    </div>
+                  );
+                })}
+              {this.state.showPreviewer && (
+                <ImagePreviewer
+                  list={imageList}
+                  index={this.state.previewerIndex}
+                  onFold={this.hidePreviewer}
+                />
+              )}
+              <div className="clearfix" />
+            </div>
+          )}
           <div className="comment-item-bottom">
             {content.reply_count ? (
               <div>
                 <a className="comment-item-bottom-left" onClick={onShowReply}>
-                  {content.reply_count} 条回复
+                  {/* {content.reply_count} 条回复 */}
+                  {intl.get("reply.totalReply", { total: content.reply_count })}
                   {showReply ? <Icon type="up" /> : <Icon type="down" />}
                 </a>
               </div>
             ) : null}
             {app.userId === content.user_id && (
               <Popconfirm
-                title="确定要删除吗?"
+                // title="确定要删除吗?"
+                title={intl.get("popConfirm.title")}
                 onConfirm={() => {
                   if (replyId) {
                     app.sDeleteReply(content.id, commentId);
                   }
                   app.sDeleteComment(content.id);
                 }}
-                okText="确定"
-                cancelText="取消"
+                okText={intl.get("popConfirm.ok")}
+                cancelText={intl.get("popConfirm.cancel")}
               >
-                <a className="comment-item-bottom-right">&nbsp; 删除</a>
+                <a className="comment-item-bottom-right">
+                  &nbsp; {intl.get("popConfirm.delete")}
+                </a>
               </Popconfirm>
             )}
             <a
               onClick={this.handleToggleInput}
               className="comment-item-bottom-right"
             >
-              &nbsp; 回复
+              &nbsp; {intl.get("comment.reply")}
             </a>
             <div
               className="comment-item-bottom-right"

src/components/Editor/Upload.js

 import { Upload, Icon, Modal, message } from "antd";
 import dayjs from "dayjs";
 import shortid from "shortid";
+import intl from "react-intl-universal";
 import {
   OSS_ENDPOINT,
   OSS_BUCKET,
     const uploadButton = (
       <div>
         <Icon type="plus" />
-        <div className="ant-upload-text">上传</div>
+        <div className="ant-upload-text">{intl.get("editor.uploadBtn")}</div>
       </div>
     );
     return (

src/components/Editor/index.js

 import PropTypes from "prop-types";
 import { Icon, Button, Popover, Input, message } from "antd";
 import classnames from "classnames";
+import intl from "react-intl-universal";
 import { OSS_LINK } from "../../constant";
 import { isFunction } from "../../helper";
 import Upload from "./Upload";
     const { maxLength } = this.props;
     let { value, fileMap, fileList } = this.state;
     if (value.length > maxLength) {
-      message.error(`字数不得超过${maxLength}字`);
+      // message.error(`字数不得超过${maxLength}字`);
+      message.error(intl.get("editor.maxLength", { maxLength }));
       return;
     }
     const files = [];
   render() {
     const {
       value,
-      placeholder,
+      // placeholder,
       rows,
       showEmoji,
       showUpload,
       closeUploadWhenBlur,
       maxUpload,
-      btnSubmitText,
+      // btnSubmitText,
       btnLoading,
       btnDisabled,
       button,
       maxLength,
       autoFocus
     } = this.props;
+    let placeholder = this.props.placeholder || intl.get("editor.placeholder");
+    let btnSubmitText = this.props.placeholder || intl.get("editor.SubmitBtn");
     const handleSubmit = this.handleSubmit;
     const disabledSubmit =
       btnDisabled ||
             "comment-editor-toolbar-error": inputValue.length > maxLength
           })}
         >
-          已输入 {inputValue.length} / {maxLength} 字
+          {intl.get("editor.alreadyEntered", {
+            count: inputValue.length,
+            maxLength
+          })}
+          {/* 已输入 {inputValue.length} / {maxLength} 字 */}
         </div>
         <div className="comment-editor">
           <TextArea
                   title={
                     <div style={{ margin: "5px auto" }}>
                       <span>
-                        上传图片
+                        {intl.get("editor.uploadTip")}
                         {maxUpload >= 2 ? (
                           <span style={{ color: "#666", fontWeight: 400 }}>
                             (您还能上传
 
 Editor.defaultProps = {
   rows: 5,
-  placeholder: "说点什么吧...",
+  // placeholder: "说点什么吧",
   showEmoji: true,
   showUpload: true,
   closeUploadWhenBlur: false,
   maxUpload: 1,
-  btnSubmitText: "发表",
+  // btnSubmitText: "发表",
   btnLoading: false,
   btnDisabled: false,
   showError: true,

src/components/ImagePreviewer/ImagePreviewer.jsx

 import React from "react";
 import classnames from "classnames";
 import { Icon, Spin } from "antd";
+import intl from "react-intl-universal";
 
 import "./ImagePreviewer.less";
 // import "./ImagePreviewer.css";
         <div className="toolbar">
           <span className="button" onClick={onFold}>
             <Icon type="to-top" />
-            收起
+            {intl.get("picture.collapse")}
           </span>
           <span className="button" onClick={this.onOrigin}>
-            <Icon type="search" /> 查看原图
+            <Icon type="search" /> {intl.get("picture.viewOriginal")}
           </span>
           {/* <span className="button" onClick={this.rotateRight}>
                         <Icon type="reload" /> 向右旋转

src/index.js

 
 window.renderComment = renderComment;
 
+renderComment({
+  id: "root-comment",
+  type: 1,
+  businessId: "test"
+});
+
 // renderComment({
 //   id: "root-comment",
 //   type: 1,

src/lang/en-US.js

+const USdata = {
+  "editor.alreadyEntered": "{count} words entered",
+  "editor.placeholder": "Say something",
+  "editor.maxLength": "Maximum {maxLength} words",
+  "editor.SubmitBtn": "Send",
+  "editor.uploadTip": "Upload pictures",
+  "editor.uploadCount": "(You could upload {count} more)",
+  "editor.uploadBtn": "Upload",
+
+  "comment.tourist": "Visitor",
+  "comment.totalComment":
+    "Total {total, plural, =1 {one comment} other {# comments}}",
+  "comment.reply": "Reply",
+  "comment.moreComment": "More comments",
+
+  "reply.totalReply": "Total {total, plural, =1 {one reply} other {# replies}}",
+  "reply.moreReply": "More replies",
+  "reply.collapse": "Fold replies",
+
+  "picture.collapse": "Fold",
+  "picture.viewOriginal": "See the original",
+
+  "popConfirm.title": "Delete?",
+  "popConfirm.ok": "Confirm",
+  "popConfirm.cancel": "Cancel",
+  "popConfirm.delete": "Delete",
+
+  "message.noMoreComment": "No more comments",
+  "message.noMoreData": "No more data",
+  "message.notNull": "It's still empty",
+  "message.success": "Comments sent",
+  "message.replyNoNull": "It's still empty",
+  "message.replySuccess": "Reply sent",
+  "message.cancelLickSuccess": "Unliked",
+  "message.likeSuccess": "Liked"
+};
+
+export default USdata;

src/lang/index.js

-// 语言包
-// 英文短语和中文提示的对应
-const data = {
-  "not found": "没有数据",
-  "auth failed": "请先登录",
-  "create comment failed": "创建评论失败",
-  "comment favor failed": "评论点赞失败",
-  "delete comment favor failed": "评论取消点赞失败",
-  "get comments failed": "获取评论列表失败",
-  "create reply failed": "创建回复失败",
-  "reply favor failed": "回复点赞失败",
-  "delete reply favor failed": "删除回复点赞失败",
-  "get replies failed": "获取回复列表失败"
-};
+/**
+ * 当前支持的语言
+ */
+export const SUPPORT_LOCALES = [
+  {
+    name: "English",
+    value: "en-US"
+  },
+  {
+    name: "简体中文",
+    value: "zh-CN"
+  }
+];
 
-export default data;
+// 服务端返回的英文短语和中文提示的对应
+export const LOCALES_RESPONSE = {
+  "zh-CN": {
+    "not found": "没有数据",
+    "auth failed": "请先登录",
+    "create comment failed": "评论未发送",
+    "comment favor failed": "点赞失败",
+    "delete comment favor failed": "取消点赞失败",
+    "get comments failed": "评论加载失败",
+    "create reply failed": "回复失败",
+    "reply favor failed": "点赞失败",
+    "delete reply favor failed": "取消点赞失败",
+    "get replies failed": "回复加载失败"
+  },
+  "en-US": {
+    "not found": "No data",
+    "auth failed": "Please Login",
+    "create comment failed": "Comments not sent",
+    "comment favor failed": "Liking failed",
+    "delete comment favor failed": "Unliking failed",
+    "get comments failed": "Comments loading failed",
+    "create reply failed": "Replying failed",
+    "reply favor failed": "Liking failed",
+    "delete reply favor failed": "Unliking failed",
+    "get replies failed": "Loading of replies failed"
+  }
+};

src/lang/zh-CN.js

+const CNdata = {
+  "editor.alreadyEntered": "已输入{count}/140字",
+  "editor.placeholder": "说点什么吧...",
+  "editor.maxLength": "字数上限{maxLength}",
+  "editor.SubmitBtn": "发送",
+  "editor.uploadTip": "上传图片",
+  "editor.uploadCount": "(您还能上传{count}张图片)",
+  "editor.uploadBtn": "上传",
+
+  "comment.tourist": "游客",
+  "comment.totalComment": "共{total}条评论",
+  "comment.reply": "回复",
+  "comment.moreComment": "更多评论",
+
+  "reply.totalReply": "共{total}条回复",
+  "reply.moreReply": "更多回复",
+  "reply.collapse": "收起回复",
+
+  "picture.collapse": "收起",
+  "picture.viewOriginal": "查看原图",
+
+  "popConfirm.title": "确定要删除吗",
+  "popConfirm.ok": "确定",
+  "popConfirm.cancel": "取消",
+  "popConfirm.delete": "删除",
+
+  "message.noMoreComment": "没有更多评论了",
+  "message.noMoreData": "没有更多数据了！",
+  "message.notNull": "没写内容呢",
+  "message.success": "评论已发送！",
+  "message.replyNoNull": "没写内容呢",
+  "message.replySuccess": "回复已发送！",
+  "message.cancelLickSuccess": "已取消点赞！",
+  "message.likeSuccess": "已赞！"
+};
+
+export default CNdata;