DVA輕框架使用（更新中）

最近因爲項目須要急需一個redux+react+router的架構，最後找到了DVA這個名字很將來的輕量級框架，但一上手就遇到了坑，因此記錄下來，以便後人爬坑。

首先，要搞DVA確定要有得搞才行，DVA倉庫：https://github.com/dvajs/dva

而後看到了一個快速上手的DEMO：12 步 30 分鐘，完成用戶管理的 CURD 應用 https://github.com/sorrycc/blog/issues/18

最喜歡這些快速開發的了，因此就按着步驟一步步來，而後到第6步就爆炸了。。。

徹底按照步驟來卻沒有出現antd的樣式

 

 

 

 

 

 

 

 

 

而後不斷地校驗代碼，發現多是對第2步的理解有問題

原文是這樣地寫：

修改 .roadhogrc，在 "extraBabelPlugins" 里加上：

["import", { "libraryName": "antd", "style": "css" }]

因此我是這樣寫的：

{
  "entry": "src/index.js",
  "env": {
    "development": {
      "extraBabelPlugins": [
        "dva-hmr",
        "transform-runtime"
      ]
    },
    "production": {
      "extraBabelPlugins": [
        "transform-runtime",
        ["import", { "libraryName": "antd", "style": "css" }]
      ]
    }
	
  }
}

而後看清楚點有兩個extraBabelPlugins，而後把插入的代碼改到development裏面就能夠產生樣式了

{
  "entry": "src/index.js",
  "env": {
    "development": {
      "extraBabelPlugins": [
        "dva-hmr",
        "transform-runtime",
        ["import", { "libraryName": "antd", "style": "css" }]
      ]
    },
    "production": {
      "extraBabelPlugins": [
        "transform-runtime"
      ]
    }
	
  }
}

若是想知道具體的.roadhogrc配置能夠查看：https://www.npmjs.com/package/roadhog