Component-based Color Game @ Modern Web and App Programming

從前面安裝完元件後，直接跳到要求自己寫一個 component-based 的 color game，不管怎麼樣我都覺得太快啊啊啊。

但還是重頭來試著刻看看了⋯⋯。

首先

先做 npm 初始檔 package.json

npm init

導入 webpack 打包工具

npm install --save-dev webpack

新增 webpack.config.js 檔

把 webpack 加入快速執行指令

"scripts": {

"build": "webpack" ,

"watch": "webpack -w",

    "test": "echo \"Error: no test specified\" && exit 1"

},

再來安裝 CSS loader 才可以 import css 檔

npm install --save-dev css-loader style-loader

當然也要去 webpack.config.js 新增 css 打包指令

再來安裝 babel

npm install --save-dev babel-core babel-loader babel-preset-es2015

還有 babel 的 polyfill

npm install --save-dev babel-polyfill

最後在 webpack.config.js 新增 js 的打包指令還有 import polyfill 就完成準備工作了

可以開始準備寫 Color Game 的 Component Based 版

先依照 DOM 製作 html 檔

然後打開 component.js 我傻眼了
因為 export default class / import / static getRootClass()
這些完全看不懂啊

20hrs