react的创建

反应配置的时候，发现很多都是一步一步来配置文件的，不过好处的是，可以帮助我们理解的WebPack，而这配置也太慢了，如果没存好，还得再来一遍！

1、当然，我们有快速搭建项目的指令：

npm install -g create-react-app

2、创建项目：列如（my-app）

create-react-app my-app[你想要的项目名称]

在该目录内，您可以运行几个命令：

  NPM开始
    。启动开发服务器

  NPM构建运行
    将应用程序捆绑资料到静态文件中进行。生产

  NPM测试
    。开始测试跑步者

  NPM运行弹出 
    删除此工具并复制构建依赖项和配置文件
    和脚本到应用程序目录中。如果你这样做，你不能回去！ 
我们建议您先输入以下内容：
  cd grewer 
  npm开始

这里基本都很清楚地给我们了知道了;

3、可以启动了：

npm stsrt

如果你的构建速度慢的话，可以考虑一下使用cnpm。

class grewer extends React.Component {

    constructor(props){

super（props）; this .state = {} } render（）{ return <div> Hello！</ div>; } }

反应的引用组件可以是任何位置的，比如他在当前页面的话：

function LoginButton（props）{
   return（
     <button onClick = {props.onClick}>
      Login
    </ button>
   ）;
}



class App extends React.Component {
...
    render（）{
     return <div> welcome！<LoginButton onClick =“this.methods”/> </ div> ;  
}
...
}

可以直接就放在上面了，而如果是其他页面，也可以引用，如：

components.js：

 
          class  
          App  
          extends  
          React.Component { 
         
          ... 
         
          }; 
         
          export  
          default  
          App;

index.js（主页面）：

 
          import  
          Grewer from  
          './components.js' 
          ;

然后再渲写写上

 
          <Grewer  />

就可以了;

猜你喜欢