Skip to content

Commit 77f9fd4

Browse files
committed
add zh-cn(Chinese) version of README.
1 parent d4bfaa9 commit 77f9fd4

File tree

1 file changed

+192
-0
lines changed

1 file changed

+192
-0
lines changed

README-zh_cn.md

+192
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,192 @@
1+
[![Build Status](https://teamcity.jetbrains.com/app/rest/builds/buildType:JetBrainsUi_CreateReactKotlinApp/statusIcon.svg)](https://teamcity.jetbrains.com/viewType.html?buildTypeId=JetBrainsUi_CreateReactKotlinApp&guest=1)
2+
[![JetBrains team project](http://jb.gg/badges/team.svg)](https://confluence.jetbrains.com/display/ALL/JetBrains+on+GitHub)
3+
4+
[Japanese](https://github.com/JetBrains/create-react-kotlin-app/blob/master/README-ja.md)
5+
[Korean](https://github.com/JetBrains/create-react-kotlin-app/blob/master/README-ko.md)
6+
[Chinese](https://github.com/JetBrains/create-react-kotlin-app/blob/master/README-zh_cn.md)
7+
8+
# Create React Kotlin App
9+
10+
在不填加 build 配置的情况下,使用[Kotlin](https://kotlinlang.org/)创建[React](https://facebook.github.io/react/)应用。
11+
12+
请注意这是一个 **早期预览版本**
13+
14+
## 快速预览
15+
16+
**在开始之前,请确保你安装了[JDK 8](http://www.oracle.com/technetwork/java/index.html)** ,Java 9 目前是不支持的。
17+
18+
创建一个新的项目:
19+
20+
```sh
21+
npx create-react-kotlin-app my-app
22+
```
23+
([npx](https://medium.com/@maybekatz/introducing-npx-an-npm-package-runner-55f7d4bd282b) 存在于 npm 5.2+ 或更高版本,如果你使用旧的npm版本,请参见[安装](#安装))
24+
25+
运行这个项目
26+
27+
```sh
28+
cd my-app/
29+
npm start
30+
```
31+
然后打开 [http://localhost:3000/](http://localhost:3000/) 来查看你的应用。<br>
32+
当你做好部署到生产的准备,使用 `npm run build` 创建一个 minified bundle
33+
34+
Create React Kotlin App 将会配置 Kotlin, webpack 和 IntelliJ IDEA ,你可以专注于你的代码。
35+
36+
仅仅创建一个项目,你就可以轻松开始。
37+
38+
## 开始
39+
40+
### 安装
41+
42+
全局安装:
43+
44+
```sh
45+
npm install -g create-react-kotlin-app
46+
```
47+
48+
如果你已经安装了 `create-react-app` 或者你在使用 `npx`, 你可以跳过这步。
49+
50+
51+
**你需要使用 Node >= 6 的版本**. 你可以使用 [nvm](https://github.com/creationix/nvm#usage) 在不同项目间切换node版本
52+
53+
**This tool doesn’t assume a Node backend**. The Node installation is only required for Create React Kotlin App itself.
54+
55+
### 使用Kotlin编写React应用
56+
57+
要使用Kotlin编写React应用,你需要使用一个[Kotlin的React包装](https://www.npmjs.com/package/@jetbrains/kotlin-react)
58+
你可以在[这里](https://github.com/JetBrains/kotlin-wrappers/tree/master/kotlin-react)找到它的文档和示例
59+
60+
### 添加 Kotlin/JS
61+
62+
**不需要任何配置**来为基于Create React Kotlin App创建的项目添加用Kotlin编写的包,我们会为你做好这一切。
63+
比如,你可以简单地运行 `npm install @jetbrains/kotlin-react-router-dom` 来安装 [wrapper for React Router DOM](https://www.npmjs.com/package/@jetbrains/kotlin-react-router-dom).
64+
65+
66+
### 创建一个应用
67+
68+
要创建一个新的应用,运行:
69+
70+
```sh
71+
create-react-kotlin-app my-app
72+
cd my-app
73+
```
74+
如果你安装了 `create-react-app` ,你可以运行:
75+
76+
```sh
77+
create-react-app my-app --scripts-version react-scripts-kotlin
78+
cd my-app
79+
```
80+
它将创建一个叫 `my-app` 的文件夹在当前目录下。<br>
81+
项目将被自动预配置为使用 [IntelliJ IDEA](https://www.jetbrains.com/idea/) 开发。如果你不想创建 `.idea` 这个被 IntelliJ IDEA 需要的文件夹,请在运行时添加 `--no-idea` 选项。<br>
82+
以下初始的项目结构将被自动创建,依赖将会自动安装:
83+
84+
85+
```
86+
my-app/
87+
README.md
88+
node_modules/
89+
package.json
90+
.gitignore
91+
public/
92+
favicon.ico
93+
index.html
94+
manifest.json
95+
src/
96+
app/
97+
App.css
98+
App.kt
99+
index/
100+
index.css
101+
index.kt
102+
logo/
103+
kotlin.svg
104+
Logo.css
105+
Logo.kt
106+
react.svg
107+
ticker/
108+
Ticker.kt
109+
```
110+
111+
这是一个简单的应用程序,显示了自打开应用程序以来经过的时间。<br>
112+
安装完成后,您可以在项目文件夹中运行一些命令:
113+
114+
### `npm start` or `yarn start`
115+
116+
在开发模式下运行应用<br>
117+
打开 [http://localhost:3000](http://localhost:3000) 在浏览器中查看
118+
119+
当你编辑时,页面会自动刷新<br>
120+
你将在控制台中看到构建错误和 lint 警告
121+
122+
如果你遇到了 `Kotlin.defineModule is not a function` 错误,尝试删除npm缓存:
123+
124+
rm -rf node_modules/.cache
125+
126+
### `npm run build` or `yarn build`
127+
128+
`build` 目录中为生产环境构建<br>
129+
为生产环境构建的版本位于 `build` 目录中<br>
130+
它确保了 React 使用生产模式,并且这个构建已经过优化,可以获得最佳性能
131+
132+
这个构建是 minified 过的,且文件名包含了用于缓存管理的哈希
133+
134+
### 调试应用
135+
136+
你可以使用 IntelliJ IDEA 旗舰版内置的 JavaScript 调试器调试运行中的应用。IDE将会启动一个新的Chrome实力,并为此添加调试器。
137+
138+
使用 `npm start` 启动你的应用,并在Kotlin代码中添加断点
139+
140+
在右上角的 run/debug configurations 中选择 `Debug in Chrome` 并点击绿色的调式按钮,或按下 `^D`(在 Mac OS 上) / `F9` (在Windows和Linux上)来开始调试。
141+
142+
目前,调试器只被 IntelliJ IDEA Ultimate 2017.3 支持
143+
144+
你也可以使用浏览器中的开发者工具调试你的应用
145+
146+
147+
## Philosophy
148+
149+
* **一个依赖:** 只有一个构建依赖。它使用了webpack和其他出色的项目,但是在它们之上提供了富有凝聚力的开发体验。
150+
151+
* **无需配置:** 你什么都不需要配置。为您处理了开发和生产版本的合理且良好配置,因此您可以专注于编写代码。
152+
153+
* **No Lock-In:** 你可以随时回到你的个性化设置。 运行一个命令,所有配置和构建依赖项都将直接移到您的项目中,您可以轻松回到上次停下来的地方。
154+
155+
## 这里边有什么?
156+
157+
生成的项目使用了以下 npm 模块:
158+
* [Kotlin wrappers](https://github.com/JetBrains/kotlin-wrappers): [@jetbrains/kotlin-react](https://www.npmjs.com/package/@jetbrains/kotlin-react), [@jetbrains/kotlin-react-dom](https://www.npmjs.com/package/@jetbrains/kotlin-react-dom), [@jetbrains/kotlin-extensions](https://www.npmjs.com/package/@jetbrains/kotlin-extensions)
159+
* [Kotlin DSL for HTML](https://www.npmjs.com/package/kotlinx-html)
160+
* [Kotlin Compiler](https://www.npmjs.com/package/kotlin-compiler)
161+
* [webpack](https://webpack.github.io/) with [webpack-dev-server](https://github.com/webpack/webpack-dev-server), [@jetbrains/kotlin-webpack-plugin](https://www.npmjs.com/package/@jetbrains/kotlin-webpack-plugin), [html-webpack-plugin](https://github.com/ampedandwired/html-webpack-plugin) and [style-loader](https://github.com/webpack/style-loader)
162+
* and others.
163+
164+
## 为什么使用这个?
165+
166+
通过 `create-react-kotlin-app` 你可以快速开启一个使用 React 和 Kotlin 编写的应用。 你的环境将包含构建Kotlin React应用的一切:
167+
* Kotlin和React语法支持
168+
* 一个开发服务来自动编译你的Kotlin代码到JavaScript
169+
* 一个build脚本,用于将JavaScript,CSS和图像用于生产,并带有 source maps
170+
171+
## 限制
172+
173+
* 当前项目暂时不支持使用单元测试,我们现在致力于 Jest Kotlin wrapper 敬请关注!
174+
175+
## 转换为自定义设置
176+
177+
你可以将项目从工具中“弹出”,并像模板生成器一样使用。
178+
179+
运行 `npm run eject` 复制所有配置文件和可转移的依赖 (webpack, Kotlin Compiler, etc) 到你的项目中,这使你拥有对项目的完整控制。诸如 `npm start``npm run build` 这样的命令将继续工作,但它们将指向复制出的脚本,因此你可以对其进行调整。 至此,你可以自由发挥了。
180+
181+
**注意:这是个单向操作,一旦你 `eject`,你将不能返回!**
182+
183+
## 贡献和报告问题
184+
185+
请在 [YouTrack](https://youtrack.jetbrains.com/issues/CRKA) 上报告问题,本项目的 Github issue 已经关闭
186+
187+
欢迎大家为此项目做贡献! 请查看这个打开的 [issues](https://youtrack.jetbrains.com/issues/CRKA?q=State:%20Open) ,或者在 **#react** [Slack](http://slack.kotlinlang.org/) 频道中与我们讨论
188+
189+
## 致谢
190+
191+
这个项目基于 Facebook 的 [Create React App](https://github.com/facebookincubator/create-react-app). 非常感谢其作者的工作和启发。
192+

0 commit comments

Comments
 (0)