{"action":"created","issue":{"url":"https://api.github.com/repos/FaridSafi/react-native-gifted-messenger/issues/141","repository_url":"https://api.github.com/repos/FaridSafi/react-native-gifted-messenger","labels_url":"https://api.github.com/repos/FaridSafi/react-native-gifted-messenger/issues/141/labels{/name}","comments_url":"https://api.github.com/repos/FaridSafi/react-native-gifted-messenger/issues/141/comments","events_url":"https://api.github.com/repos/FaridSafi/react-native-gifted-messenger/issues/141/events","html_url":"https://github.com/FaridSafi/react-native-gifted-messenger/issues/141","id":160352377,"number":141,"title":"Gifted-messenger on web","user":{"login":"reformer","id":10958854,"avatar_url":"https://avatars.githubusercontent.com/u/10958854?v=3","gravatar_id":"","url":"https://api.github.com/users/reformer","html_url":"https://github.com/reformer","followers_url":"https://api.github.com/users/reformer/followers","following_url":"https://api.github.com/users/reformer/following{/other_user}","gists_url":"https://api.github.com/users/reformer/gists{/gist_id}","starred_url":"https://api.github.com/users/reformer/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/reformer/subscriptions","organizations_url":"https://api.github.com/users/reformer/orgs","repos_url":"https://api.github.com/users/reformer/repos","events_url":"https://api.github.com/users/reformer/events{/privacy}","received_events_url":"https://api.github.com/users/reformer/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":1,"created_at":"2016-06-15T07:06:01Z","updated_at":"2016-06-15T08:01:52Z","closed_at":null,"body":"Hi,\r\nI trying to port GiftedMessanger on web, but i stuck in one error that i not able solve after spending so many days. My package..json is \r\n```\r\n \"dependencies\": {\r\n    \"react\": \"0.14.8\",\r\n    \"react-web\": \"0.2.4\",\r\n    \"react-dom\": \"0.14.7\",\r\n    \"react-native\": \"0.23.1\",\r\n    \"react-art\": \"0.14.0\",\r\n    \"socket.io-client\": \"1.3.7\",\r\n    \"react-router\": \"2.4.1\",\r\n    \"@exponent/react-native-navigator\": \"0.4.2\",\r\n    \"react-native-incall-manager\": \"1.1.0\",\r\n    \"react-native-extra-dimensions-android\": \"^0.17.0\",\r\n    \"react-native-gifted-messenger\": \"*\"\r\n  },\r\n  \"devDependencies\": {\r\n    \"babel-core\": \"6.9.0\",\r\n    \"babel-loader\": \"6.2.4\",\r\n    \"babel-preset-es2015\": \"6.6.0\",\r\n    \"babel-preset-react\": \"6.5.0\",\r\n    \"react-hot-loader\": \"1.3.0\",\r\n    \"webpack\": \"1.13.0\",\r\n    \"webpack-dev-server\": \"1.14.1\",\r\n    \"haste-resolver-webpack-plugin\": \"0.1.2\",\r\n    \"webpack-html-plugin\": \"0.1.1\",\r\n    \"css-loader\": \"0.23.1\",\r\n    \"style-loader\": \"0.13.1\",\r\n  \t\"file-loader\": \"0.8.5\"\r\n  }\r\n```\r\n\r\n```\r\nMy web config is,\r\n\r\nmodule.exports = {\r\n  ip: IP,\r\n  port: PORT,\r\n  devtool: 'source-map',\r\n  resolve: {\r\n    alias: {\r\n      'react-native': 'react-web',\r\n      'ReactNativeART': 'react-art',\r\n    },\r\n    extensions: ['', '.js', '.jsx'],\r\n  },\r\n  entry: isProd? [\r\n    config.paths.index\r\n  ]: [\r\n    'webpack-dev-server/client?http://' + IP + ':' + PORT,\r\n    'webpack/hot/only-dev-server',\r\n    config.paths.index,\r\n  ],\r\n  output: {\r\n    path: path.join(__dirname, 'output'),\r\n    filename: 'bundle.js'\r\n  },\r\n  plugins: [\r\n     new HasteResolverPlugin({\r\n      platform: 'web',\r\n      nodeModules: ['react-web']\r\n    }),\r\n    new webpack.DefinePlugin({\r\n      'process.env': {\r\n        'NODE_ENV': JSON.stringify('development'),\r\n      }\r\n    }),\r\n    isProd? new webpack.ProvidePlugin({\r\n      React: \"react\"\r\n    }): new webpack.HotModuleReplacementPlugin(),\r\n    new webpack.NoErrorsPlugin(),\r\n    new HtmlPlugin(),\r\n  ],\r\n  module: {\r\n    loaders: [\r\n\t  {\r\n      test: /\\.jsx?$/,\r\n      loaders: ['react-hot', 'babel-loader?presets[]=es2015,presets[]=react'],\r\n      include: [config.paths.src],\r\n      exclude: [/node_modules/]\r\n\t  },\r\n    { \r\n      test: /\\.css$/, \r\n      loader: \"style-loader!css-loader\"\r\n    },\r\n\t{\r\n      test: /.*\\.(gif|png|jpe?g|svg)$/i,\r\n      loader: 'file-loader'\r\n    }],\r\n    resolve: {\r\n      extensions: ['.js', '.jsx']\r\n    }\r\n  }\r\n};\r\n```\r\n\r\nMy implementation for porting,\r\n'use strict';\r\n\r\n```\r\nvar React = require('react-native');\r\n```\r\nvar {\r\n  AppRegistry\r\n} = React;\r\n\r\nAppRegistry.registerComponent('PortedOnWeb', () => require('./GiftedMessengerContainer'));\r\n```\r\n\r\nNow my issue while compiling,\r\n\r\n```\r\n [421] ./~/react-web/lib/NativeModules/NativeModules.web.js 170 bytes {0} [built]\r\n [422] ./~/react-web/lib/StyleSheet/processColor.web.js 229 bytes {0} [built]\r\n [423] ./GiftedMessengerContainer.js 12.2 kB {0} [built] [1 error]\r\n [425] ./~/react-hot-loader/makeExportsHot.js 1.69 kB {0} [built]\r\n [426] ./~/react-hot-loader/isReactClassish.js 801 bytes {0} [built]\r\n [427] ./~/react-hot-loader/isReactElementish.js 288 bytes {0} [built]\r\n\r\nRROR in ./~/react-native-gifted-messenger/GiftedMessenger.js\r\nodule parse failed: D:\\MyDirectory\\node_modules\\react-native-gifted-messenger\\GiftedMessenger.js Unexpected token (398:10)\r\nou may need an appropriate loader to handle this file type.\r\nyntaxError: Unexpected token (398:10)\r\n   at Parser.pp.raise (D:\\MyDirectory\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:923:13)\r\n   at Parser.pp.unexpected (D:\\MyDirectorySharedRepo\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:1490:8)\r\n   at Parser.pp.parseExprAtom (D:\\MyDirectory\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:333:12)\r\n   at Parser.pp.parseExprSubscripts (D:\\MyDirectory\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:228:19)\r\n   at Parser.pp.parseMaybeUnary (D:\\MyDirectory\\SharedRepo\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:207:17)\r\n   at Parser.pp.parseExprOps (D:\\MyDirectory\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:154:19)\r\n   at Parser.pp.parseMaybeConditional (D:\\MyDirectory\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:136:19)\r\n   at Parser.pp.parseMaybeAssign (D:\\MyDirectory\\SharedRepo\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:112:19)\r\n   at Parser.pp.parseParenAndDistinguishExpression (D:\\MyDirectory\\SharedRepo\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:376:28)\r\n   at Parser.pp.parseExprAtom (D:MyDirectory\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:307:19)\r\n   at Parser.pp.parseExprSubscripts (D:\\MyDirectory\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:228:19)\r\n   at Parser.pp.parseMaybeUnary (D:\\MyDirectory\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:207:17)\r\n   at Parser.pp.parseExprOps (D:\\MyDirectory\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:154:19)\r\n   at Parser.pp.parseMaybeConditional (D:\\MyDirectory\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:136:19)\r\n   at Parser.pp.parseMaybeAssign (D:\\MyDirectory\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:112:19)\r\n   at Parser.pp.parseExpression (D:\\MyDirectory\\SharedRepo\\node_modules\\webpack\\node_modules\\acorn\\dist\\acorn.js:88:19)\r\n@ ./GiftedMessengerContainer.js 19:22-62\r\n```\r\n\r\nPlease give me hint where i'm wrong. What will be the possible way to resolve it."},"comment":{"url":"https://api.github.com/repos/FaridSafi/react-native-gifted-messenger/issues/comments/226116140","html_url":"https://github.com/FaridSafi/react-native-gifted-messenger/issues/141#issuecomment-226116140","issue_url":"https://api.github.com/repos/FaridSafi/react-native-gifted-messenger/issues/141","id":226116140,"user":{"login":"FaridSafi","id":388375,"avatar_url":"https://avatars.githubusercontent.com/u/388375?v=3","gravatar_id":"","url":"https://api.github.com/users/FaridSafi","html_url":"https://github.com/FaridSafi","followers_url":"https://api.github.com/users/FaridSafi/followers","following_url":"https://api.github.com/users/FaridSafi/following{/other_user}","gists_url":"https://api.github.com/users/FaridSafi/gists{/gist_id}","starred_url":"https://api.github.com/users/FaridSafi/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/FaridSafi/subscriptions","organizations_url":"https://api.github.com/users/FaridSafi/orgs","repos_url":"https://api.github.com/users/FaridSafi/repos","events_url":"https://api.github.com/users/FaridSafi/events{/privacy}","received_events_url":"https://api.github.com/users/FaridSafi/received_events","type":"User","site_admin":false},"created_at":"2016-06-15T08:01:51Z","updated_at":"2016-06-15T08:01:51Z","body":"Hello,\r\nI think you can't use react-web for porting it to web. You better have to start from scratch and to follow the same API/props names/etc.\r\nAlso I suggest you to wait the v0.2.x release because a lot of things will change https://github.com/FaridSafi/react-native-gifted-messenger/tree/v0.2.x/GiftedMessengerExample\r\n"}}
{"actor":{"display_login":"FaridSafi"}}