Question

我要在网络上移植GiftedMessanger。

我在Webpack bundle中遇到错误：

Krishti:react-native-web-exploding-hearts-master MacBook$ npm run web-bundle

> react-native-web-exploding-hearts@0.0.1 web-bundle /Users/MacBook/WebWork/ReactWeb/react-native-web-exploding-hearts-master
> NODE_ENV=production webpack --config web/webpack.config.js --colors

Crawl: 6012ms
Hash: d8df1262d7af54a6c6cd
Version: webpack 1.12.10
Time: 10949ms
   [0] multi main 28 bytes {0} [built]
    + 339 hidden modules

ERROR in ./~/react-native-gifted-messenger/GiftedMessenger.js
Module parse failed: /Users/MacBook/WebWork/ReactWeb/react-native-web-exploding-hearts-master/node_modules/react-native-gifted-messenger/GiftedMessenger.js Line 1: Unexpected token
You may need an appropriate loader to handle this file type.
| import React, {
|   Text,
|   View,
 @ ./GiftedMessengerContainer.js 19:22-62

我不知道究竟是什么问题。我的webconfig文件是

   'use strict';

var path = require('path');
var webpack = require('webpack');
var HtmlPlugin = require('webpack-html-plugin');
var HasteResolverPlugin = require('haste-resolver-webpack-plugin');

var IP = '0.0.0.0';
var PORT = 3000;
var NODE_ENV = process.env.NODE_ENV;
var ROOT_PATH = path.resolve(__dirname, '..');
var PROD = 'production';
var DEV = 'development';
let isProd = NODE_ENV === 'production';

var config = {
  paths: {
    src: path.join(ROOT_PATH, '.'),
    index: path.join(ROOT_PATH, 'index.ios'),
  },
};

module.exports = {
  ip: IP,
  port: PORT,
  devtool: 'source-map',
  resolve: {
    alias: {
      'react-native': 'react-web',
    },
    extensions: ['', '.js', '.jsx'],
  },
  entry: isProd? [
    config.paths.index
  ]: [
    'webpack-dev-server/client?http://' + IP + ':' + PORT,
    'webpack/hot/only-dev-server',
    config.paths.index,
  ],
  output: {
    path: path.join(__dirname, 'output'),
    filename: 'bundle.js'
  },
  plugins: [
    new HasteResolverPlugin({
      platform: 'web',
      nodeModules: ['react-web']
    }),
    new webpack.DefinePlugin({
      'process.env': {
        'NODE_ENV': JSON.stringify(isProd? PROD: DEV),
      }
    }),
    isProd? new webpack.ProvidePlugin({
      React: "react"
    }): new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin(),
    new HtmlPlugin(),
  ],
  module: {
    loaders: [{
      test: /\.json$/,
      loader: 'json',
    }, {
      test: /\.jsx?$/,
      loaders: ['react-hot', 'babel?stage=1'],
      include: [config.paths.src],
      exclude: [/node_modules/]
    }, {
        test: /\.es6\.js$/, loader: "babel-loader",
        query: {
          presets: ['es2015']
        }
      }]
  }
};

My GiftedMessenger.js是

import React, {
  Text,
  View,
  ListView,
  TextInput,
  Dimensions,
  Animated,
  Platform,
  PixelRatio,
  Component,
} from 'react-native';

import Message from './Message';
import GiftedSpinner from 'react-native-gifted-spinner';
import moment from 'moment';
import {setLocale} from './Locale';
import deepEqual from 'deep-equal';
import Button from 'react-native-button';

class GiftedMessenger extends Component {

  constructor(props) {..... many code stuff

My GiftedMessengerContainer.js是

'use strict';
var React = require('react-native');
import React, {
  Linking,
  Platform,
  ActionSheetIOS,
  Dimensions,
  View,
  Text,
  //Navigator,
  Component,
} React;

var GiftedMessenger = require('react-native-gifted-messenger');
var Communications = require('react-native-communications');


// var STATUS_BAR_HEIGHT = Navigator.NavigationBar.Styles.General.StatusBarHeight;
// if (Platform.OS === 'android') {
//   var ExtraDimensions = require('react-native-extra-dimensions-android');
//   var STATUS_BAR_HEIGHT = ExtraDimensions.get('STATUS_BAR_HEIGHT');
// }


class GiftedMessengerContainer extends Component {
.
.
.
code stuff

我到底哪里错了？

模块解析失败

0 个答案: