NodeJS React 開發環境搭建
阿新 • • 發佈:2017-10-27
安裝 image 好運 框架 con 訪問 啟動 view server
1、首先需要安裝NodeJS環境,下載NodeJS安裝程序安裝即可。 NodeJS下載地址: https://nodejs.org/en/download/
2、安裝NodeJS的web框架express npm install express-generator -g
3、創建項目
express studyReact
4、添加jsx引擎支持
npm install express-react-views --save
5、修改view 目錄下的index.jade文件後綴為jsx, 內容如下:
6、編寫react組件,需要安裝react react-dom
npm install react react-dom --save
7、使用webpack 編譯打包 需要安裝webpack
npm install webpack babel babel-loader --save
8、在項目中添加webpack.config.js文件,內容如下:
9、命令行中使用 webpack編譯項目,成功後出現如下結果:
10、啟動項目,瀏覽器中訪問
npm start
瀏覽器中訪問 https://localhost:3000
出現如下結果表示環境成功搭建
註:本例子中每次修改內容需要手動使用webpack來編譯,想修改後自動編譯刷新頁面請使用webpack-dev-server。
完,祝大家好運。
NodeJS React 開發環境搭建