今天，打算寫第乙個頁面，結果遇到了些阻力，沒有想象的那麼簡單，有些特定的配置，還有元件的引用，還有css和js的載入模式。
在index.js裡面引入元件模組：
reactdom.render(, document.getelementbyid('root'));元件模組**：
class searchroom extends react.component
}export default searchroom
並沒有生成html檔案，我們需要安裝
html-webpack-plugin
並且在webpack.config.js裡面進行配置
const
htmlwebpackplugin =
require(
'html-webpack-plugin');
const
cleanwebpackplugin =
require(
'clean-webpack-plugin');
model..
exports = ),
newcleanwebpackplugin([
'dist/assets'])],
...這樣就可以在指定，目錄下生成編譯後的html了。
再次打包，就可以了，在元件裡面編寫react**生成頁面。
然後就是樣式的引入，明天的主要工作，樣式有公共的樣式和模組的樣式引入配置。
插曲：cleanwebpackplugin
(paths [, ])
'dist/assets'
]今天的頁面：
關於樣式的引入：
1、公共css的引入
在jsx裡面引入
import
'./assets/css/iuapmobile.um.css';
2、對於自己寫的css
先宣告：
import
searchroomstyle
from
'./searchroom.css';
建立css檔案、然後寫css：
.cai
在js裡面新增 classname =「cai」,樣式生效。
使用react-router-dom，通過路由，實現頁面的變化。
React webpack模組組織關係
現代前端開發離不開打包工具，以 webpack 為代表的打包工具已經成為日常開發必備之利器，拿 react 技術棧為例，我們 es6 形式的源 需要經過 webpack 和 babel 處理，才能生成發布版檔案，在瀏覽器中執行。今天就結合 react 來梳理一下 webpack 打包時模組的組織結構...
react webpack專案實際開發應用
1.知其然不知其所以然，你只會了jsx語法，卻只能照貓畫虎，卻不知道react背後的基礎知識，如果你連jsx最後會編譯成js都不知道，或者編譯成的js都讀不懂，那更不用談靈活擴充套件和開發了。2.乙個專案要想開發出來僅僅需要只知道react還需要知道很多知識，比如現在很多教程和專案都是webpack...
js之旅（七）js中this
本文講述js中this的指向 介紹es5和es6中this的不同 在js es5中，使用的是function函式，誰在呼叫function，this就指向誰，有以下幾個特點 1.1 this最終指向的是呼叫它的物件 這個特點的就是es5中this的指向，其它特點都是對它的補充，如下示例 functi...