Javascript 为什么不能'；我的吞咽不管用吗_Javascript_Node.js_Reactjs

Javascript 为什么不能'；我的吞咽不管用吗

javascript node.js reactjs

Javascript 为什么不能'；我的吞咽不管用吗,javascript,node.js,reactjs,Javascript,Node.js,Reactjs,这是我的gulpfiles.js： let gulp = require('gulp'); let uglify = require('gulp-uglify'); let browserify = require('browserify'); let babelify = require('babelify'); let source = require('vinyl-source-stream'); let buffer = require('vinyl-buffer'); gu

这是我的

gulpfiles.js

：

let gulp = require('gulp');
let uglify = require('gulp-uglify');
let browserify = require('browserify');
let babelify = require('babelify');
let source = require('vinyl-source-stream');
let buffer = require('vinyl-buffer');


    gulp.task('js',()=>{
        browserify({
            entries : ['App/app.js'],
            extensive : ['.js'],
            debug:true
        })
            .transform(babelify,babelify.configure())
            .bundle()
            .pipe(source('app.js'))
            .pipe(buffer())
            .pipe(uglify())
            .pipe(gulp.dest('build'))
    });

    gulp.task('default',['js']);

import React from 'react'
import ReactDom from 'react-dom'

    class Helloworld extends React.Purecomponent{
        render(){
            return(
                <h1> Good morning </h1>
            );
        }
    }

    ReactDom.render(
            <Helloworld />,
            document.getElementById('app')
    );

这是我的

.babelrc

：

{
  "presets": ["es2015","react","stage-1"]
}

这是我的

index.html

：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="fonts.css" />
    <link rel="shortcut icon" href="favicon.ico">
    <title>Weather-App</title>
</head>
<body>
<div id="app"></div>
</body>
<script src="build/app.js"></script>
</html>

我不知道为什么当我启动浏览器时，它什么也不显示。打包过程中不会显示错误。

要查看browserify错误，您需要订阅

错误事件。尝试以下方法：
gulp.task('js',()=>{
    browserify({
        entries : ['App/app.js'],
        extensive : ['.js'],
        debug:true
    })
        .transform(babelify,babelify.configure())
        .bundle()
        .on('error', function (err) {
          console.log(err.message);
          this.emit('end');
        })
        .pipe(source('app.js'))
        .pipe(buffer())
        .pipe(uglify())
        .pipe(gulp.dest('build'))
});

gulp.task('default',['js']);

特别针对您的情况，您的组件存在一些错误。它应该是PureComponent
而不是PureComponent
和ReactDOM
而不是ReactDOM
：
class Helloworld extends React.PureComponent{
  render(){
    return(
      <h1> Good morning </h1>
    );
  }
}

ReactDOM.render(
  <Helloworld />,
  document.getElementById('container')
);

类Helloworld扩展了React.PureComponent{
render（）{
返回(
早上好
);
}
}
ReactDOM.render(
,
document.getElementById（'容器'）
);
当我将React.Purecomponent更改为React.Component时，它会工作

从“React”导入React
从“react dom”导入react dom
类Helloworld扩展了React.Component{
render（）{
返回(
早上好
);
}
}
ReactDom.render(
,
document.getElementById（'app'）
);非常感谢，我使用PureComponent而不是PureComponent，而且workded@answerhua没问题。正如我提到的，我鼓励您订阅错误事件。这将使开发更加容易：）