我将把GiftedMessanger 移植到网络上。
我在 Webpack 包中遇到了一个错误:
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']
}
}]
}
};
我的 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
我的 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
我到底哪里错了?