Question

以下是这个问题：Splitting React components into separate files

我试图进入React，看起来很有趣。我使用Gulp进行转换，但收到以下错误：

ParseError: 'import' and 'export' may appear only with 'sourceType: module'

违规的jsx文件是：

import React from 'react';

class Square extends React.Component{
    render() {
        return (
            <p>Square</p>
        )
    }
}

export default Square;

我的Gulp文件是：

var vendors = [
    'react'
];

gulp.task('vendors', function () {
    var stream = browserify({
        debug: false,
        require: vendors
    });

    stream.bundle()
        .transform('babelify', {presets: ['es2015', 'react']})
        .bundle()
        .pipe(source('./src/main.js'))
        .pipe(gulp.dest('./dist/bundle.js'));

    return stream;
});

我的package.json就是：

{
  "name": "reacttestone",
  "version": "1.0.0",
  "description": "Testing React Components",
  "main": "index.js",
  "dependencies": {
    "react": "^0.14.2",
    "react-dom": "^0.14.2"
  },
  "devDependencies": {
    "babel-preset-es2015": "^6.1.2",
    "babel-preset-react": "^6.1.2",
    "babelify": "^7.2.0",
    "gulp": "^3.9.0",
    "vinyl-source-stream": "^1.1.0"
  },
  "browserify": {
    "transform": [
      "babelify"
    ]
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "Myself",
  "license": "MIT"
}

有什么想法？谢谢。非常接近为前端找到一个Javascript库我喜欢：）

在React上导入和导出Gulp解析错误

0 个答案: