react-利用Atom搭建开发环境

学习完React Native抽时间来看看它的基础React,利用ATom来搭建Reactjs开发环境

atom

github官方推出的编辑器

atom-beautify插件

atom-beautify用来格式化代码用的,在atom编辑器中打开’Settings’面板,可以通过快捷键Command+,来打开,打开后进入Install,在搜索框中输入atom-beautify,然后点击安装就行:

react-利用Atom搭建开发环境_第1张图片

atom-html-preview插件

atom-html-preview用来实时展现html页面效果的,安装方式和上面一样。

react-利用Atom搭建开发环境_第2张图片

配置快捷键

在设置页面点击KeyBindings菜单,然后点击your keymap file进入设置快捷键界面:

react-利用Atom搭建开发环境_第3张图片
react-利用Atom搭建开发环境_第4张图片

输入以下内容:

'atom-text-editor':
  'ctrl-F12':'atom-html-preview:toggle'
'.editor':
  'ctrl-alt-b': 'atom-beautify:beautify-editor'
  • atom-html-preview的快捷键是Ctrl+F12
  • atom-beautify的快捷键为ctrl-alt-b

下载ReactJS

ReactJS下载后解压,然后导入到项目中即可,重要的是以下几个文件:

react-利用Atom搭建开发环境_第5张图片

Helloworld React

react-利用Atom搭建开发环境_第6张图片

你可能感兴趣的:(框架学习[RN])