Reactjs项目构建

1.通过node环境创建react工程插件

npm install -g create-react-app

2.指定目录创建React工程

create-react-app <工程名>

3.进入目录启动项目

cd <工程根目录>
yarn start

4.创建第一个组件

创建welcome.js

import React, {Component} from 'react';class Welcome extends Component {render() {return <h1> Hello, World! </h1>}
}
export default Welcome

并将新组件引入到主页面中

import React from 'react';
import logo from './logo.svg';
import './App.css';
import Welcome from './Welcome';function App() {return (<div className="App"><header className="App-header"><img src={logo} className="App-logo" alt="logo" /><p>Edit <code>src/App.js</code> and save to reload.</p><aclassName="App-link"href="https://reactjs.org"target="_blank"rel="noopener noreferrer">Learn React</a><Welcome/> {/* 引入新组件 */}</header></div>);
}
export default App;

刷新页面

5.打包

yarn build

个人博客：Karma‘s Blog
源码地址：传送门

Reactjs项目构建相关推荐

项目构建之maven篇:2.HelloWorld项目构建过程
文件结构说明: 项目构建生命周期: 清理编译測试打包执行部署清理与编译 hello\pom.xml POM:Project Object Model,项目对象模型 pom.xml与ant的 ...
深度学习（五十六）tensorflow项目构建流程
tensorflow项目构建流程博客:http://blog.csdn.net/hjimce 微博:黄锦池-hjimce qq:1393852684 一.构建路线个人感觉对于任何一个深度学习库 ...
基于koajs的web项目构建-心得篇
2019独角兽企业重金招聘Python工程师标准>>> 根据基于koajs的web项目构建-入门篇所描述的,建立了项目的基本目录结构,接下来的工作便是编码,编译,测试,发布.做为 ...
Spring Cloud云服务架构 - common-service 项目构建过程
2019独角兽企业重金招聘Python工程师标准>>> 我们将对common-service整个项目进行剖析,将整个构建的流程给记录下来,让更多的关注者来参考学习. 首先在构建spr ...
ReSharper“无法解析符号”，即使在项目构建时
本文翻译自:ReSharper "Cannot resolve symbol" even when project builds My Tools: 我的工具: Visual St ...
Maven学习总结（2）——Maven项目构建过程练习
Maven学习总结(二)--Maven项目构建过程练习上一篇只是简单介绍了一下maven入门的一些相关知识,这一篇主要是体验一下Maven高度自动化构建项目的过程一.创建Maven项目 1.1.建 ...
Java B2B2C多用户商城 springcloud架构- common-service 项目构建过程（七）...
我们将对common-service整个项目进行剖析,将整个构建的流程给记录下来,让更多的关注者来参考学习. 首先在构建spring cloud的common-service之前,我们需要准备的技术: ...
Maven学习总结(二)——Maven项目构建过程练习
2019独角兽企业重金招聘Python工程师标准>>> Maven学习总结(二)--Maven项目构建过程练习上一篇只是简单介绍了一下maven入门的一些相关知识,这一篇主要是体验 ...
Java B2B2C多用户商城 springcloud架构- common-service 项目构建过程（七）
我们将对common-service整个项目进行剖析,将整个构建的流程给记录下来,让更多的关注者来参考学习. 首先在构建spring cloud的common-service之前,我们需要准备的技术: ...
spring cloud架构 - HongHu common-service 项目构建过程
2019独角兽企业重金招聘Python工程师标准>>> 我们将对common-service整个项目进行剖析,将整个构建的流程给记录下来,让更多的关注者来参考学习. 首先在构建spr ...

Reactjs项目构建

1.通过node环境创建react工程插件

2.指定目录创建React工程

3.进入目录启动项目

4.创建第一个组件

5.打包

Reactjs项目构建相关推荐

最新文章

热门文章