Live Note

Remain optimistic

项目文件目录

1
2
3
4
5
6
7
8
9
10
11
12
-Demo
|--build
|--dist
|--css
|--js
|--view
|--node_modules
|--src
|--
|--package.json
|--webpack.config.js
|--webpack.production.config.js
  • src:代码开发目录
  • build:开发环境 webpack 输出目录
  • dist:生产环境 webpack 输出目录
  • package.json:项目配置
  • webpack.config.js:开发环境配置
  • webpack.production.config.js:生产环境配置

webpack 配置文件

需命名为 webpack.config.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
const path = require("path") // 模块

module.exports = {
mode: "development",
entry: path.join(__dirname, "./src/main.js"), // 入口文件
output: {
path: path.join(__dirname, "./dist"), // 输出文件
filename: "bundle.js",
},
plugins: [
// 插件
],
module: {
rules: [
// 路由规则
{
test: /\.css$/,
use: ["style-loader", "css-loader"],
},
{
test: /\.(png|jpg|gif|bmp|jpeg)$/,
use: "url-loader?limit=1111&name=[hash:8]-[name].[ext]",
},
{
test: /\.(ttf|eot|svg|woff|woff2)$/,
use: "url-loader",
},
{
test: /\.js$/,
use: "babel-loader",
exclude: /node_modules/,
},
],
},
}

webpack-dev-server

  • 通过 npm 安装:npm i webpack-dev-server
  • 运行命令:webpack-dev-server –devtool eval –port 9876 –progress –colors – compress –hot –inline –content-base ./build
    可以在 package.json 中的 script 加一个启动项。
  • –devtool eval:在报错时精确到文件的行号
  • –progress:显示编译的输出内容进度
  • –compress:启用 gzip 压缩
  • –hot:热更新,无需刷新浏览器
  • –colors:显示编译的输出内容颜色
  • –inline:自动刷新模式。默认为 iframe。
  • –content-base:设置输出目录。

Function

function has special rules:

  1. It must work for every possible input value
  2. And it has only one relationship for each input value

Although each input will only have one output, but for different inputs may have the same output.

Pure function

Given all these, pure functions have a big set of advantages. They are easier to read and understand, as they do one thing. There is no need to look outside the function code and check for variables. There is no need to think how changing the value of the variable will affect other functions. No mutations in other functions will affect the result of the pure function for a specific input.
Pure functions are easier to test, as all dependencies are in the function definition and they do one thing.
For Example:

1
2
3
4
5
6
7
8
9
10
var arr = [1, 2, 3]

// Pure
arr.slice(0, 2) // [1, 2]
arr.slice(0, 2) // [1, 2]
arr.slice(2, 3) // [3]

// Impure
arr.splice(0, 2) // [1, 2]
arr.splice(0, 2) // [3]

Another Example:

1
2
3
4
5
6
7
8
9
10
11
// Impure
var sign = 3

// The return value depends on the system status
var isBigger = (num) => num > 3

// Pure
var isBigger = (num) => {
var sign = 3
return num > sign
}

序言

农业和游牧或工业不同,它是直接取资与土地的。
游牧的人飘忽不定,工业可以择地而居。
而种地的人却搬不动地。

从农业本身来看,是无需群居的。最小的社区可以只有一户人家。
夫妻和孩子聚集,满足两性与抚养的需要。
无论在什么性质的社会里,家庭总是最基本的抚养社群。

中国农民聚集而居原因:

  1. 耕地面积小,小农经营。住所与耕地不会相隔太远
  2. 需要水利,所以大家一起合作。
  3. 合作弊害。
  4. 土地继承。

农村属于 face to face group,所以 文字 在农村并没有太大意义。

社会学中通常两种不同性质的社会:

  1. 共同体:没有主要的目的聚集。
  2. 社会:有主要的目的聚集。

孝是什么,孔子并没有抽象地加以说明。最后归结到“心安”二字。
做子女的在日常接触中熟悉父母的性格,然后承他们的欢,做到心安。

Read more »

工作以來的感受

最大的感受就是,需要學習的還有很多很多。獨立思考可以讓你的思維更加開放、活躍,同時可以激發更多的靈感。
目前的技術棧:React+Mobx+TypeScirpt

從前對狀態管理沒有什麽概念,自從接觸到工程項目之後,對爲何要進行 State Management 越來越清晰。
當然也產生了一定的不良影響 -> 只要上手就會想如何設計 State,導致有的地方代碼實在冗餘。

同時在項目代碼中瞭解了許多新知識,如何去設計一個可繼承、可復用的 Function;如何將 Store 封裝,便於使用;如何對請求進行封裝;何時使用 Interface、何時使用 Type;等等……

接下來需要做的

  • 思考之前的代碼如何優化
  • 思考目前的代碼是否還能拆分
  • 閲讀 State Management 的文章
  • ……

課餘時間的活動

  • 書籍

    • 熵的世界
    • 我的簡史 - 霍金
  • 日常

    • 陰陽師
    • B 站
    • 手游 - 跑跑卡丁車
    • 音樂
  • 綜藝

    • 説唱新世代
    • 中國新説唱
  • 影視劇

    • 甜蜜蜜
    • 投名狀
    • 親愛的
    • 八佰
    • Mulan
    • 信條

挖坑

考慮用點什麽搭一個自己的博客。

见证历史了吧

上证指数开盘涨停。

国家这次真算得上破釜成舟了。

就是不知道,半年/多年后回过头来看,这是起大厦的首日,还是倾大厦的首日呢?

不得而知。 楼他们是不打算救了,可以考虑购买房子了。