摘要:使用快速構建開發環境第一步安裝全局包是來自于,通過該命令我們無需配置就能快速構建開發環境。執行以下命令創建項目項目目錄在瀏覽器中打開,即可顯示上一篇開發教程初識下一篇開發教程三組件的構建
react安裝
React可以直接下載使用,下載包中也提供了很多學習的實例。
本教程使用了 React 的版本為 15.4.2,你可以在官網 http://facebook.github.io/react/ 下載最新版。
你也可以直接使用 BootCDN 的 React CDN 庫,地址如下:
使用實例
Hello React!
使用 create-react-app 快速構建 React 開發環境 第一步、安裝全局包react.min.js - React 的核心庫 react-dom.min.js - 提供與 DOM 相關的功能
babel.min.js - Babel 可以將 ES6 代碼轉為 ES5 代碼,這樣我們就能在目前不支持 ES6 瀏覽器上執行 React
代碼。Babel 內嵌了對 JSX 的支持。通過將 Babel 和 babel-sublime
包(package)一同使用可以讓源碼的語法渲染上升到一個全新的水平。
create-react-app 是來自于 Facebook,通過該命令我們無需配置就能快速構建 React 開發環境。
create-react-app 自動創建的項目是基于 Webpack + ES6 。
執行以下命令創建項目:
$ cnpm install -g create-react-app $ create-react-app my-app $ cd my-app/ $ npm start //項目目錄 |____my-app |____README.md |____node_modules/ | |____package.json |____.gitignore |____public | |____favicon.ico | |____index.html |____src | |____App.css | |____App.js | |____App.test.js | |____index.css | |____index.js | |____logo.svg
在瀏覽器中打開 http://localhost:3000/ ,即可顯示
上一篇:react開發教程(-)初識
下一篇:react開發教程(三)組件的構建
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/82544.html
摘要:相關鏈接詳細教程,從無到有搭建腳手架一配置插件,這兩個插件基本上是必配的了介紹每次打包時清理上次打包生成的目錄官網指南關于這個插件部分內容已經過時沒有更新,按照官網配置會出錯,所以參考上這個插件文檔來配置,文檔地址生成打 相關鏈接 webpack4詳細教程,從無到有搭建react腳手架(一) 配置插件 clean-webpack-plugin、 html-webpack-plugin...
摘要:相關鏈接詳細教程,從無到有搭建腳手架一詳細教程,從無到有搭建腳手架二詳細教程,從無到有搭建腳手架三管理打包后目錄結構打包結構如下修改配置通過相對目錄對資源命名前加上目錄名,效果后面的步驟在這里需要安裝一個大型的包,以為例安裝為第三 相關鏈接 webpack4詳細教程,從無到有搭建react腳手架(一) webpack4詳細教程,從無到有搭建react腳手架(二) webpack4詳細...
摘要:把目錄添加到環境變量中打開控制面板系統和安全系統高級系統設置高級環境變量,選中變量,然后點擊編輯。 最近公司要開發react-native項目,自己在windows系統上練習了一下,過程中發現好多問題,在這里整理出來供大家參考; 一、首先來看一下reactNative官網 官網上的教程很詳細,介紹了IOS和Android的環境搭建、示例教程等等,建議大家先按照官網的環境搭建教程嘗試搭...
摘要:把目錄添加到環境變量中打開控制面板系統和安全系統高級系統設置高級環境變量,選中變量,然后點擊編輯。 最近公司要開發react-native項目,自己在windows系統上練習了一下,過程中發現好多問題,在這里整理出來供大家參考; 一、首先來看一下reactNative官網 官網上的教程很詳細,介紹了IOS和Android的環境搭建、示例教程等等,建議大家先按照官網的環境搭建教程嘗試搭...
閱讀 1508·2021-08-09 13:47
閱讀 2767·2019-08-30 15:55
閱讀 3491·2019-08-29 15:42
閱讀 1114·2019-08-29 13:45
閱讀 3008·2019-08-29 12:33
閱讀 1742·2019-08-26 11:58
閱讀 983·2019-08-26 10:19
閱讀 2410·2019-08-23 18:00