-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathatom.xml
2254 lines (2012 loc) · 350 KB
/
atom.xml
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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">
<title>经年</title>
<link href="/atom.xml" rel="self"/>
<link href="https://feahter.github.io/"/>
<updated>2018-08-24T03:27:04.669Z</updated>
<id>https://feahter.github.io/</id>
<author>
<name>Feahter</name>
</author>
<generator uri="http://hexo.io/">Hexo</generator>
<entry>
<title>用vue-cli开发项目的初始配置</title>
<link href="https://feahter.github.io/2018/08/23/%E7%94%A8vue-cli%E5%BC%80%E5%8F%91%E9%A1%B9%E7%9B%AE%E7%9A%84%E5%88%9D%E5%A7%8B%E9%85%8D%E7%BD%AE/"/>
<id>https://feahter.github.io/2018/08/23/用vue-cli开发项目的初始配置/</id>
<published>2018-08-23T08:50:19.000Z</published>
<updated>2018-08-24T03:27:04.669Z</updated>
<content type="html"><![CDATA[<h1 id="vue-cli项目初始化配置指南"><a href="#vue-cli项目初始化配置指南" class="headerlink" title="vue-cli项目初始化配置指南"></a>vue-cli项目初始化配置指南</h1><p>1.安装vue-cli</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">npm install vue-cli -g</div></pre></td></tr></table></figure>
<p>2.初始化vue项目</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">vue init webpack myproject</div></pre></td></tr></table></figure>
<p>3.运行项目</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">cd myproject && npm run dev</div></pre></td></tr></table></figure>
<p>4.小幅度修改配置</p>
<p>config文件夹内的index.js寻找assetsPublicPath字段，修改’/‘为’./‘。</p>
<p>其作用为<code>npm run build</code>之后输出的dist静态文件可以不基于服务器环境直接查看页面效果展示。</p>
<p>5.推荐配套组件</p>
<table>
<thead>
<tr>
<th style="text-align:center">组件</th>
<th style="text-align:center">作用</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:center"><a href="http://element-cn.eleme.io/#/zh-CN/component/installation" target="_blank" rel="external">element UI</a></td>
<td style="text-align:center">UI组件，集成多种PC组件效果</td>
</tr>
<tr>
<td style="text-align:center"><a href="https://www.jianshu.com/p/7a9fbcbb1114" target="_blank" rel="external">axios</a></td>
<td style="text-align:center">http请求插件，与后台发请求的工具</td>
</tr>
<tr>
<td style="text-align:center"><a href="https://router.vuejs.org/zh/guide/" target="_blank" rel="external">vue-router</a></td>
<td style="text-align:center">脚手架默认安装，管理路由的工具</td>
</tr>
<tr>
<td style="text-align:center"><a href="https://vuex.vuejs.org/zh/guide/" target="_blank" rel="external">vuex</a></td>
<td style="text-align:center">数据状态管理的工具</td>
</tr>
</tbody>
</table>
]]></content>
<summary type="html">
<h1 id="vue-cli项目初始化配置指南"><a href="#vue-cli项目初始化配置指南" class="headerlink" title="vue-cli项目初始化配置指南"></a>vue-cli项目初始化配置指南</h1><p>1.安装vue-cli</p
</summary>
<category term="术" scheme="https://feahter.github.io/categories/%E6%9C%AF/"/>
<category term="前端" scheme="https://feahter.github.io/tags/%E5%89%8D%E7%AB%AF/"/>
<category term="vue" scheme="https://feahter.github.io/tags/vue/"/>
</entry>
<entry>
<title>Laravel+Vue+element UI+Sass+gulp+webpack相关配置</title>
<link href="https://feahter.github.io/2017/08/07/Laravel-Vue-element-UI-Sass-gulp-webpack%E7%9B%B8%E5%85%B3%E9%85%8D%E7%BD%AE/"/>
<id>https://feahter.github.io/2017/08/07/Laravel-Vue-element-UI-Sass-gulp-webpack相关配置/</id>
<published>2017-08-07T08:56:11.000Z</published>
<updated>2017-08-07T09:47:20.000Z</updated>
<content type="html"><![CDATA[<p>1.首先安装composer，php的包管理器。<br>地址：<a href="https://getcomposer.org/download/" target="_blank" rel="external">https://getcomposer.org/download/</a></p>
<p>2.然后跳转至本地虚拟环境，打开命令行利用composer安装Laravel项目：(laravelapp为项目名称)</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">composer create-project laravel/laravel laravelapp --prefer-dist</div></pre></td></tr></table></figure>
<p>3.安装完毕后依次运行：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div></pre></td><td class="code"><pre><div class="line">composer update</div><div class="line"></div><div class="line">php artisan key:generate</div><div class="line"></div><div class="line">php artisan serve</div></pre></td></tr></table></figure>
<p>访问<a href="http://127.0.0.1:8000，有返回提示页，即为成功。" target="_blank" rel="external">http://127.0.0.1:8000，有返回提示页，即为成功。</a></p>
<p>4.修改根目录下的package.json添加依赖项如下：</p>
<figure class="highlight json"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div><div class="line">16</div><div class="line">17</div><div class="line">18</div><div class="line">19</div><div class="line">20</div><div class="line">21</div><div class="line">22</div><div class="line">23</div><div class="line">24</div><div class="line">25</div><div class="line">26</div><div class="line">27</div><div class="line">28</div><div class="line">29</div><div class="line">30</div><div class="line">31</div><div class="line">32</div><div class="line">33</div><div class="line">34</div><div class="line">35</div><div class="line">36</div><div class="line">37</div><div class="line">38</div></pre></td><td class="code"><pre><div class="line">{</div><div class="line"> <span class="attr">"private"</span>: <span class="literal">true</span>,</div><div class="line"> <span class="attr">"scripts"</span>: {</div><div class="line"> <span class="attr">"dev"</span>: <span class="string">"npm run development"</span>,</div><div class="line"> <span class="attr">"development"</span>: <span class="string">"cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"</span>,</div><div class="line"> <span class="attr">"watch"</span>: <span class="string">"cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"</span>,</div><div class="line"> <span class="attr">"watch-poll"</span>: <span class="string">"npm run watch -- --watch-poll"</span>,</div><div class="line"> <span class="attr">"hot"</span>: <span class="string">"cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js"</span>,</div><div class="line"> <span class="attr">"prod"</span>: <span class="string">"npm run production"</span>,</div><div class="line"> <span class="attr">"production"</span>: <span class="string">"cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"</span></div><div class="line"> },</div><div class="line"> <span class="attr">"devDependencies"</span>: {</div><div class="line"> <span class="attr">"axios"</span>: <span class="string">"^0.16.2"</span>,</div><div class="line"> <span class="attr">"babel-core"</span>: <span class="string">"^6.20.0"</span>,</div><div class="line"> <span class="attr">"babel-loader"</span>: <span class="string">"^6.2.9"</span>,</div><div class="line"> <span class="attr">"bootstrap-sass"</span>: <span class="string">"^3.3.7"</span>,</div><div class="line"> <span class="attr">"cross-env"</span>: <span class="string">"^5.0.1"</span>,</div><div class="line"> <span class="attr">"css-loader"</span>: <span class="string">"^0.25.0"</span>,</div><div class="line"> <span class="attr">"element-ui"</span>: <span class="string">"^1.1.1"</span>,</div><div class="line"> <span class="attr">"gulp"</span>: <span class="string">"^3.9.1"</span>,</div><div class="line"> <span class="attr">"handsontable"</span>: <span class="string">"0.27.0"</span>,</div><div class="line"> <span class="attr">"jquery"</span>: <span class="string">"^3.1.1"</span>,</div><div class="line"> <span class="attr">"laravel-elixir"</span>: <span class="string">"^6.0.0-15"</span>,</div><div class="line"> <span class="attr">"laravel-elixir-vue-2"</span>: <span class="string">"^0.2.0"</span>,</div><div class="line"> <span class="attr">"laravel-elixir-webpack-official"</span>: <span class="string">"^1.0.10"</span>,</div><div class="line"> <span class="attr">"laravel-mix"</span>: <span class="string">"^1.0"</span>,</div><div class="line"> <span class="attr">"lodash"</span>: <span class="string">"^4.17.4"</span>,</div><div class="line"> <span class="attr">"node-sass"</span>: <span class="string">"^4.5.3"</span>,</div><div class="line"> <span class="attr">"style-loader"</span>: <span class="string">"^0.13.1"</span>,</div><div class="line"> <span class="attr">"vue"</span>: <span class="string">"^2.1.4"</span>,</div><div class="line"> <span class="attr">"vue-loader"</span>: <span class="string">"^10.0.0"</span>,</div><div class="line"> <span class="attr">"vue-resource"</span>: <span class="string">"^1.0.3"</span>,</div><div class="line"> <span class="attr">"vue-router"</span>: <span class="string">"^2.1.1"</span>,</div><div class="line"> <span class="attr">"vue-template-compiler"</span>: <span class="string">"^2.1.4"</span>,</div><div class="line"> <span class="attr">"element-ui"</span>: <span class="string">"^1.4.1"</span></div><div class="line"> },</div><div class="line"> <span class="attr">"dependencies"</span>: {}</div><div class="line">}</div></pre></td></tr></table></figure>
<p>4.安装node，地址：</p>
<p><a href="https://nodejs.org/en/download/" target="_blank" rel="external">https://nodejs.org/en/download/</a></p>
<p>5.node自带包管理器，在命令行运行依赖插入指令：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">npm install</div></pre></td></tr></table></figure>
<p>6.如果依赖安装过慢可挂vpn，或设置国内镜像替代运行如下指令：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">npm config set registry http://registry.npm.taobao.org</div></pre></td></tr></table></figure>
<p>7.完成后注意sass的编译依赖python，但版本请不高于2.7，请注意下载安装。</p>
<p>8.根目录新建gulpfile.js文件：编写内容如下：</p>
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div><div class="line">16</div><div class="line">17</div><div class="line">18</div><div class="line">19</div><div class="line">20</div><div class="line">21</div><div class="line">22</div><div class="line">23</div><div class="line">24</div><div class="line">25</div><div class="line">26</div><div class="line">27</div><div class="line">28</div><div class="line">29</div><div class="line">30</div><div class="line">31</div><div class="line">32</div><div class="line">33</div></pre></td><td class="code"><pre><div class="line"><span class="keyword">const</span> elixir = <span class="built_in">require</span>(<span class="string">'laravel-elixir'</span>);</div><div class="line"><span class="keyword">const</span> path = <span class="built_in">require</span>(<span class="string">'path'</span>);</div><div class="line"></div><div class="line"><span class="built_in">require</span>(<span class="string">'laravel-elixir-vue-2'</span>);</div><div class="line"><span class="comment">/*</span></div><div class="line">|--------------------------------------------------------------------------</div><div class="line">| Elixir Asset Management</div><div class="line">|--------------------------------------------------------------------------</div><div class="line">|</div><div class="line">| Elixir provides a clean, fluent API for defining some basic Gulp tasks</div><div class="line">| for your Laravel application. By default, we are compiling the Sass</div><div class="line">| file for our application, as well as publishing vendor resources.</div><div class="line">|</div><div class="line">*/</div><div class="line"></div><div class="line">elixir(mix => {</div><div class="line"> <span class="comment">// Elixir.webpack.config.module.loaders = [];</span></div><div class="line"></div><div class="line"> Elixir.webpack.mergeConfig({</div><div class="line"> resolveLoader: {</div><div class="line"> root: path.join(__dirname, <span class="string">'node_modules'</span>),</div><div class="line"> },</div><div class="line"> <span class="built_in">module</span>: {</div><div class="line"> loaders: [{</div><div class="line"> test: <span class="regexp">/\.css$/</span>,</div><div class="line"> loader: <span class="string">'style!css'</span></div><div class="line"> }]</div><div class="line"> }</div><div class="line"> });</div><div class="line"></div><div class="line"> mix.sass(<span class="string">'app.scss'</span>)</div><div class="line"> .webpack(<span class="string">'app.js'</span>)</div><div class="line">});</div></pre></td></tr></table></figure>
<p>9.resources\assets\js目录下新建App.vue文件，内容如下：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div></pre></td><td class="code"><pre><div class="line"><template></div><div class="line"><div id="app"></div><div class="line"><router-view></router-view></div><div class="line"></div></div><div class="line"></template></div></pre></td></tr></table></figure>
<p>10.修改app.js内容：</p>
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div><div class="line">16</div><div class="line">17</div><div class="line">18</div><div class="line">19</div><div class="line">20</div><div class="line">21</div><div class="line">22</div><div class="line">23</div><div class="line">24</div><div class="line">25</div><div class="line">26</div><div class="line">27</div><div class="line">28</div><div class="line">29</div><div class="line">30</div><div class="line">31</div><div class="line">32</div><div class="line">33</div><div class="line">34</div></pre></td><td class="code"><pre><div class="line"><span class="comment">/** </span></div><div class="line"> * First we will load all of this project's JavaScript dependencies which </div><div class="line"> * includes Vue and other libraries. It is a great starting point when </div><div class="line"> * building robust, powerful web applications using Vue and Laravel. </div><div class="line"> */</div><div class="line"></div><div class="line"><span class="built_in">require</span>(<span class="string">'./bootstrap'</span>);</div><div class="line"><span class="comment">/** </span></div><div class="line"> * Next, we will create a fresh Vue application instance and attach it to </div><div class="line"> * the page. Then, you may begin adding components to this application </div><div class="line"> * or customize the JavaScript scaffolding to fit your unique needs. </div><div class="line"> */</div><div class="line"><span class="keyword">import</span> Vue <span class="keyword">from</span> <span class="string">'vue'</span></div><div class="line"><span class="keyword">import</span> App <span class="keyword">from</span> <span class="string">'./App.vue'</span></div><div class="line"><span class="keyword">import</span> VueRouter <span class="keyword">from</span> <span class="string">'vue-router'</span></div><div class="line"><span class="keyword">import</span> ElementUI <span class="keyword">from</span> <span class="string">'element-ui'</span></div><div class="line"><span class="keyword">import</span> <span class="string">'element-ui/lib/theme-default/index.css'</span></div><div class="line"></div><div class="line">Vue.use(VueRouter)</div><div class="line">Vue.use(ElementUI)</div><div class="line"></div><div class="line"></div><div class="line"><span class="keyword">const</span> router = <span class="keyword">new</span> VueRouter({</div><div class="line"> routes: [</div><div class="line"> { path: <span class="string">'/'</span>, component: <span class="built_in">require</span>(<span class="string">'./components/Example.vue'</span>) }</div><div class="line"> ]</div><div class="line">})</div><div class="line"></div><div class="line"><span class="keyword">const</span> app = <span class="keyword">new</span> Vue({</div><div class="line"> el: <span class="string">'#app'</span>,</div><div class="line"> router,</div><div class="line"> template: <span class="string">'<App/>'</span>,</div><div class="line"> components: { App }</div><div class="line">});</div></pre></td></tr></table></figure>
<p>11.修改views文件夹下的welcome.blade.php文件：</p>
<figure class="highlight php"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div></pre></td><td class="code"><pre><div class="line"><!DOCTYPE html></div><div class="line"><html lang=<span class="string">"en"</span>></div><div class="line"><head></div><div class="line"><meta charset=<span class="string">"UTF-8"</span>></div><div class="line"><meta name=<span class="string">"csrf-token"</span> content=<span class="string">"{{ csrf_token() }}"</span>></div><div class="line"><title>Hello</title></div><div class="line"></head></div><div class="line"><body></div><div class="line"><div id=<span class="string">"app"</span>></div></div><div class="line"></div><div class="line"><script src=<span class="string">"{{ asset('js/app.js') }}"</span>></script></div><div class="line"></body></div><div class="line"></html></div></pre></td></tr></table></figure>
<p>运行命令 ：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div></pre></td><td class="code"><pre><div class="line">gulp watch</div><div class="line"></div><div class="line">php artisan serve</div></pre></td></tr></table></figure>
<p>基本项目即配置完毕。</p>
]]></content>
<summary type="html">
<p>1.首先安装composer，php的包管理器。<br>地址：<a href="https://getcomposer.org/download/" target="_blank" rel="external">https://getcomposer.org/downloa
</summary>
<category term="术" scheme="https://feahter.github.io/categories/%E6%9C%AF/"/>
<category term="项目配置" scheme="https://feahter.github.io/tags/%E9%A1%B9%E7%9B%AE%E9%85%8D%E7%BD%AE/"/>
<category term="Laravel" scheme="https://feahter.github.io/tags/Laravel/"/>
<category term="Vue" scheme="https://feahter.github.io/tags/Vue/"/>
</entry>
<entry>
<title>关于remetajs</title>
<link href="https://feahter.github.io/2017/08/07/%E5%85%B3%E4%BA%8Eremetajs/"/>
<id>https://feahter.github.io/2017/08/07/关于remetajs/</id>
<published>2017-08-07T08:56:11.000Z</published>
<updated>2017-08-10T01:47:54.000Z</updated>
<content type="html"><![CDATA[<h2 id="构成"><a href="#构成" class="headerlink" title="构成"></a>构成</h2><p>remeta.js主要由两部分构成，hitdpr()和remeta()。</p>
<h3 id="1-hitdpr"><a href="#1-hitdpr" class="headerlink" title="1.hitdpr"></a>1.hitdpr</h3><p>给根节点打上dpr标记，区分高倍屏，方便图片资源替换。</p>
<h3 id="2-remeta"><a href="#2-remeta" class="headerlink" title="2.remeta"></a>2.remeta</h3><p>通关设置目标参数集中适配同一版css，可直接使用px，而无需计算em或是rem。</p>
<h2 id="场景"><a href="#场景" class="headerlink" title="场景"></a>场景</h2><p>适用所有情况下的关于屏幕适配的问题，跨屏自适应，兼容ie8+，减轻媒体查询工作。</p>
<h2 id="代码"><a href="#代码" class="headerlink" title="代码"></a>代码</h2><figure class="highlight javascript"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div><div class="line">16</div><div class="line">17</div><div class="line">18</div><div class="line">19</div><div class="line">20</div><div class="line">21</div><div class="line">22</div><div class="line">23</div><div class="line">24</div><div class="line">25</div><div class="line">26</div><div class="line">27</div><div class="line">28</div><div class="line">29</div><div class="line">30</div><div class="line">31</div><div class="line">32</div><div class="line">33</div><div class="line">34</div><div class="line">35</div><div class="line">36</div><div class="line">37</div><div class="line">38</div><div class="line">39</div><div class="line">40</div><div class="line">41</div><div class="line">42</div><div class="line">43</div><div class="line">44</div><div class="line">45</div><div class="line">46</div><div class="line">47</div><div class="line">48</div><div class="line">49</div><div class="line">50</div><div class="line">51</div><div class="line">52</div><div class="line">53</div><div class="line">54</div><div class="line">55</div><div class="line">56</div><div class="line">57</div><div class="line">58</div><div class="line">59</div><div class="line">60</div><div class="line">61</div><div class="line">62</div><div class="line">63</div><div class="line">64</div><div class="line">65</div><div class="line">66</div><div class="line">67</div><div class="line">68</div><div class="line">69</div><div class="line">70</div></pre></td><td class="code"><pre><div class="line"><span class="comment">/*</span></div><div class="line"> * @Author: feahter</div><div class="line"> * @Date: 2017-08-02 15:38:47</div><div class="line"> * @Last Modified by: feahter</div><div class="line"> * @Last Modified time: 2017-08-03 11:57:31</div><div class="line"> */</div><div class="line"><span class="meta"></span></div><div class="line">'use strict';</div><div class="line"></div><div class="line">! <span class="function"><span class="keyword">function</span>(<span class="params">w, d</span>) </span>{</div><div class="line"> <span class="keyword">var</span> _width = w.screen.availWidth;</div><div class="line"> <span class="keyword">var</span> dpr = <span class="number">0</span>;</div><div class="line"></div><div class="line"> <span class="function"><span class="keyword">function</span> <span class="title">hitdpr</span>(<span class="params"></span>) </span>{</div><div class="line"> <span class="keyword">var</span> isAndroid = w.navigator.appVersion.match(<span class="regexp">/android/gi</span>);</div><div class="line"> <span class="keyword">var</span> isIPhone = w.navigator.appVersion.match(<span class="regexp">/iphone/gi</span>);</div><div class="line"> <span class="keyword">var</span> devicePixelRatio = w.devicePixelRatio;</div><div class="line"> <span class="keyword">if</span> (isIPhone) {</div><div class="line"> <span class="comment">// iOS下，对于2和3的屏，用2倍的方案，其余的用1倍方案</span></div><div class="line"> <span class="keyword">if</span> (devicePixelRatio >= <span class="number">3</span> && (!dpr || dpr >= <span class="number">3</span>)) {</div><div class="line"> dpr = <span class="number">3</span>;</div><div class="line"> } <span class="keyword">else</span> <span class="keyword">if</span> (devicePixelRatio >= <span class="number">2</span> && (!dpr || dpr >= <span class="number">2</span>)) {</div><div class="line"> dpr = <span class="number">2</span>;</div><div class="line"> } <span class="keyword">else</span> {</div><div class="line"> dpr = <span class="number">1</span>;</div><div class="line"> }</div><div class="line"> } <span class="keyword">else</span> {</div><div class="line"> devicePixelRatio ? dpr = devicePixelRatio : dpr = <span class="number">1</span>;</div><div class="line"> }</div><div class="line"> d.documentElement.setAttribute(<span class="string">'data-dpr'</span>, dpr);</div><div class="line"> }</div><div class="line"></div><div class="line"> <span class="function"><span class="keyword">function</span> <span class="title">remeta</span>(<span class="params">target</span>) </span>{</div><div class="line"> <span class="keyword">var</span> _meta = d.querySelector(<span class="string">'meta[name="viewport"]'</span>);</div><div class="line"> <span class="keyword">var</span> scale = _width / target;</div><div class="line"> <span class="keyword">if</span> (scale > <span class="number">1</span>) { scale = <span class="number">1</span>; }</div><div class="line"> <span class="keyword">var</span> oString = <span class="string">"width=device-width, initial-scale="</span> + scale + <span class="string">", maximum-scale="</span> + scale + <span class="string">", user-scalable=no"</span>;</div><div class="line"> <span class="keyword">if</span> (!_meta) {</div><div class="line"> _meta = d.createElement(<span class="string">'meta'</span>);</div><div class="line"> _meta.setAttribute(<span class="string">'name'</span>, <span class="string">'viewport'</span>);</div><div class="line"> _meta.setAttribute(<span class="string">'content'</span>, oString);</div><div class="line"> <span class="keyword">if</span> (_meta.firstElementChild) {</div><div class="line"> _meta.firstElementChild.appendChild(_meta);</div><div class="line"> } <span class="keyword">else</span> {</div><div class="line"> <span class="keyword">var</span> wrap = d.createElement(<span class="string">'div'</span>);</div><div class="line"> wrap.appendChild(_meta);</div><div class="line"> <span class="built_in">document</span>.write(wrap.innerHTML);</div><div class="line"> }</div><div class="line"> } <span class="keyword">else</span> {</div><div class="line"> _meta.setAttribute(<span class="string">'content'</span>, oString);</div><div class="line"> }</div><div class="line"> };</div><div class="line"> <span class="comment">// 页面加载调用</span></div><div class="line"> (<span class="function"><span class="keyword">function</span>(<span class="params"></span>) </span>{</div><div class="line"> <span class="keyword">if</span> (_width <= <span class="number">414</span>) {</div><div class="line"> remeta(<span class="number">414</span>);</div><div class="line"> } <span class="keyword">else</span> <span class="keyword">if</span> (_width > <span class="number">414</span> && _width <= <span class="number">768</span>) {</div><div class="line"> remeta(<span class="number">768</span>);</div><div class="line"> } <span class="keyword">else</span> <span class="keyword">if</span> (_width > <span class="number">768</span> && _width <= <span class="number">1200</span>) {</div><div class="line"> remeta(<span class="number">1280</span>);</div><div class="line"> }</div><div class="line"> hitdpr();</div><div class="line"> })();</div><div class="line"> <span class="comment">//用户变化屏幕方向时调用</span></div><div class="line"> w.addEventListener(<span class="string">'orientationchange'</span>, <span class="function"><span class="keyword">function</span>(<span class="params">e</span>) </span>{</div><div class="line"> <span class="keyword">if</span> (_width >= <span class="number">768</span> && _width <= <span class="number">1200</span>) {</div><div class="line"> location.reload();</div><div class="line"> }</div><div class="line"> });</div><div class="line">}(<span class="built_in">window</span>, <span class="built_in">document</span>);</div></pre></td></tr></table></figure>
<h3 id="1-hitdpr-1"><a href="#1-hitdpr-1" class="headerlink" title="1.hitdpr()"></a>1.hitdpr()</h3><figure class="highlight javascript"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div><div class="line">16</div><div class="line">17</div><div class="line">18</div></pre></td><td class="code"><pre><div class="line"><span class="function"><span class="keyword">function</span> <span class="title">hitdpr</span>(<span class="params"></span>) </span>{</div><div class="line"> <span class="keyword">var</span> isAndroid = w.navigator.appVersion.match(<span class="regexp">/android/gi</span>);</div><div class="line"> <span class="keyword">var</span> isIPhone = w.navigator.appVersion.match(<span class="regexp">/iphone/gi</span>);</div><div class="line"> <span class="keyword">var</span> devicePixelRatio = w.devicePixelRatio;</div><div class="line"> <span class="keyword">if</span> (isIPhone) {</div><div class="line"> <span class="comment">// iOS下，对于2和3的屏，用2倍的方案，其余的用1倍方案</span></div><div class="line"> <span class="keyword">if</span> (devicePixelRatio >= <span class="number">3</span> && (!dpr || dpr >= <span class="number">3</span>)) {</div><div class="line"> dpr = <span class="number">3</span>;</div><div class="line"> } <span class="keyword">else</span> <span class="keyword">if</span> (devicePixelRatio >= <span class="number">2</span> && (!dpr || dpr >= <span class="number">2</span>)) {</div><div class="line"> dpr = <span class="number">2</span>;</div><div class="line"> } <span class="keyword">else</span> {</div><div class="line"> dpr = <span class="number">1</span>;</div><div class="line"> }</div><div class="line"> } <span class="keyword">else</span> {</div><div class="line"> devicePixelRatio ? dpr = devicePixelRatio : dpr = <span class="number">1</span>;</div><div class="line"> }</div><div class="line"> d.documentElement.setAttribute(<span class="string">'data-dpr'</span>, dpr);</div><div class="line"> }</div></pre></td></tr></table></figure>
<p>通过window对象的devicePixelRatio属性获取dpr，正则匹配判断区分设备系统类型，给根节点打上标记。</p>
<h3 id="2-remta"><a href="#2-remta" class="headerlink" title="2.remta()"></a>2.remta()</h3><figure class="highlight javascript"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div><div class="line">16</div><div class="line">17</div><div class="line">18</div><div class="line">19</div><div class="line">20</div></pre></td><td class="code"><pre><div class="line"><span class="function"><span class="keyword">function</span> <span class="title">remeta</span>(<span class="params">target</span>) </span>{</div><div class="line"> <span class="keyword">var</span> _meta = d.querySelector(<span class="string">'meta[name="viewport"]'</span>);</div><div class="line"> <span class="keyword">var</span> scale = _width / target;</div><div class="line"> <span class="keyword">if</span> (scale > <span class="number">1</span>) { scale = <span class="number">1</span>; }</div><div class="line"> <span class="keyword">var</span> oString = <span class="string">"width=device-width, initial-scale="</span> + scale + <span class="string">", maximum-scale="</span> + scale + <span class="string">", user-scalable=no"</span>;</div><div class="line"> <span class="keyword">if</span> (!_meta) {</div><div class="line"> _meta = d.createElement(<span class="string">'meta'</span>);</div><div class="line"> _meta.setAttribute(<span class="string">'name'</span>, <span class="string">'viewport'</span>);</div><div class="line"> _meta.setAttribute(<span class="string">'content'</span>, oString);</div><div class="line"> <span class="keyword">if</span> (_meta.firstElementChild) {</div><div class="line"> _meta.firstElementChild.appendChild(_meta);</div><div class="line"> } <span class="keyword">else</span> {</div><div class="line"> <span class="keyword">var</span> wrap = d.createElement(<span class="string">'div'</span>);</div><div class="line"> wrap.appendChild(_meta);</div><div class="line"> <span class="built_in">document</span>.write(wrap.innerHTML);</div><div class="line"> }</div><div class="line"> } <span class="keyword">else</span> {</div><div class="line"> _meta.setAttribute(<span class="string">'content'</span>, oString);</div><div class="line"> }</div><div class="line"> };</div></pre></td></tr></table></figure>
<p>获取当前设备的真实宽度，设置目标target参数，通过创建或改写name为viewport的meta标签参数达到缩放目的。</p>
<h3 id="3-调用"><a href="#3-调用" class="headerlink" title="3.调用"></a>3.调用</h3><figure class="highlight javascript"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div><div class="line">16</div><div class="line">17</div></pre></td><td class="code"><pre><div class="line"><span class="comment">// 页面加载调用</span></div><div class="line"> (<span class="function"><span class="keyword">function</span>(<span class="params"></span>) </span>{</div><div class="line"> <span class="keyword">if</span> (_width <= <span class="number">414</span>) {</div><div class="line"> remeta(<span class="number">414</span>);</div><div class="line"> } <span class="keyword">else</span> <span class="keyword">if</span> (_width > <span class="number">414</span> && _width <= <span class="number">768</span>) {</div><div class="line"> remeta(<span class="number">768</span>);</div><div class="line"> } <span class="keyword">else</span> <span class="keyword">if</span> (_width > <span class="number">768</span> && _width <= <span class="number">1200</span>) {</div><div class="line"> remeta(<span class="number">1280</span>);</div><div class="line"> }</div><div class="line"> hitdpr();</div><div class="line"> })();</div><div class="line"> <span class="comment">//用户变化屏幕方向时调用</span></div><div class="line"> w.addEventListener(<span class="string">'orientationchange'</span>, <span class="function"><span class="keyword">function</span>(<span class="params">e</span>) </span>{</div><div class="line"> <span class="keyword">if</span> (_width >= <span class="number">768</span> && _width <= <span class="number">1200</span>) {</div><div class="line"> location.reload();</div><div class="line"> }</div><div class="line"> });</div></pre></td></tr></table></figure>
<p>通过判断参数调用remeta(target)实现集中兼容，小于逻辑宽度为414的均集中缩放至414的显示效果，通过监听orientationchange事件刷新横竖屏变化事件。</p>
]]></content>
<summary type="html">
<h2 id="构成"><a href="#构成" class="headerlink" title="构成"></a>构成</h2><p>remeta.js主要由两部分构成，hitdpr()和remeta()。</p>
<h3 id="1-hitdpr"><a href="#1
</summary>
<category term="术" scheme="https://feahter.github.io/categories/%E6%9C%AF/"/>
<category term="JavaScript" scheme="https://feahter.github.io/tags/JavaScript/"/>
</entry>
<entry>
<title>研究生算法设计大纲</title>
<link href="https://feahter.github.io/2017/05/17/%E7%A0%94%E7%A9%B6%E7%94%9F%E7%AE%97%E6%B3%95%E8%AE%BE%E8%AE%A1%E5%A4%A7%E7%BA%B2/"/>
<id>https://feahter.github.io/2017/05/17/研究生算法设计大纲/</id>
<published>2017-05-17T01:27:31.000Z</published>
<updated>2017-05-17T01:42:40.000Z</updated>
<content type="html"><![CDATA[<p><strong>College of Software Engineering</strong><br><strong>Undergraduate Course Syllabus</strong><br>Course ID 311036030 Course Name Data Structures & Algorithm<br>Course<br>Attribute<br>□Compulsory □Selective Course Language □English █Chinese<br>Credit Hour 3 Period 48<br>Semester □First Fall □First Spring █Second Fall □Second Spring<br>□Third Fall □Third Spring □Fourth Fall □Fourth Spring<br>Instructors Li xiaohua，Zuo hang，Sun Jieping, Zhu Hong<br>Description<br>This course thoroughly covers key data structures at the undergraduate<br>level. With a focus on how to assess costs and benefits, it teaches students<br>how to create efficient data structures and algorithms and how to adopt<br>to new design challenges. Students are taught how to assess applications<br>needs to find data structures with matching capabilities.</p>
<p>Prerequisites C Language Programming<br>Discrete Mathematics</p>
<p>Textbook A Practical Introduction to Data Structures and Algorithm Analysis，Clifford A.<br>Shaffer，Prentice Hall 2001. Second Edition<br>Resource<br>①A.V.Aho,J.E.Hopcroft and J.D.Ullman,Data Structures and Algorithms,by Addison——Wesley<br>Publishing Company,Inc.,1983<br>② Cliford A. Shaffer，A Practical Introduction to Data Structures and Algorithm Analysis——<br>C++)，Publishing house of electronics industry.<br>Grading assignments, class participation (40%), final exam (60%)<br>Topics</p>
<ol>
<li>Data Structures and Algorithms. 1h<br>A Philosophy of Data Structures. Abstract Data Types and Data Structures. Problems, Algorithms,<br>and Programs.</li>
<li>Mathematical Preliminaries. 2h<br>2<br>ets and Relations. Miscellaneous Notation. Logarithms. Recursion. Summations and Recurrences.<br>Mathematical Proof Techniques. Estimating.</li>
<li>Algorithm Analysis. 2h<br>Introduction. Best, Worst, and Average Cases. A Faster Computer, or a Faster Algorithm?<br>Asymptotic Analysis. Calculating the Running Time of a Program. Analyzing Problems. Common<br>Misunderstandings. Multiple Parameters. Space Bounds. Some Practical Considerations.</li>
<li>Lists, Stacks, and Queues. 10h<br>Lists. The Dictionary ADT. Stacks. Queues.</li>
<li>Binary Trees. 6h<br>Definitions and Properties. Binary Tree Traversals. Binary Tree Node Implementations. Binary<br>Search Trees. Heaps and Priority Queues. Huffman Coding Trees.</li>
<li>Non-Binary Trees. 4h<br>General Tree Definitions and Terminology. The Parent Pointer Implementation. General Tree<br>Implementations. K -ary Trees. Sequential Tree Implementations.</li>
<li>Internal Sorting. 5h<br>Sorting Terminology and Notation. Three …Q(n2<br>) Sorting Algorithms. Shell sort. Quick sort.<br>Merge sort. Heap sort. Bin sort and Radix Sort. An Empirical Comparison of Sorting Algorithms.<br>Lower Bounds for Sorting.</li>
<li>File Processing and External Sorting. 2h<br>Primary versus Secondary Storage. Disk Drives. Buffers and Buffer Pools. The Programmer’s<br>View of Files. External Sorting. Simple Approaches to External Sorting. Replacement Selection.<br>Multi-way Merging.</li>
<li>Searching. 3h<br>Searching Sorted Arrays. Self-Organizing Lists. Searching in Sets. Hashing.</li>
<li>Indexing. 3h<br>Linear Indexing. ISAM. Tree Indexing. 2-3 Trees. B-Trees.</li>
<li>Graphs. 9h<br>Terminology and Representations. Graph Implementations. Graph Traversals. Shortest-Paths<br>Problems. Minimum-Cost Spanning Trees.<br>3<br>Total:<br>Lecture: 47 QA: 1<br>Tools &<br>Environment<br>This course will require to use VC++ 6.0 software for programming<br>Projects<br>Project: City database Management System<br>Requirements:<br>1） Using BST or linked lis t to store the records；<br>2） Each node should contain the name of city and the coordination of city(denoted using x,y)；<br>3） Organize the node in database according to the name of city<br>4） Insert single or multiple nodes, delete or index node in accordance with name or coordination.<br>5） Print all records which have certain distance with a given city<br>6） Statistic the runtime of each operation<br>7) encourage adding in innovate functions<br>Development environment:<br>VC++ 6.0</li>
</ol>
<p>Version No： 1.0<br>Author： Xiaohua Li Date： 2008-7 -15<br>Auditor： Mei Hong Date： 2008-7-25<br>Signature of leader：<br>Date： 2008-7-30</p>
<h3 id="中文翻译："><a href="#中文翻译：" class="headerlink" title="中文翻译："></a>中文翻译：</h3><p><strong>软件工程学院</strong><br><strong>本科课程大纲</strong><br>课程编号311036030课程名称数据结构与算法<br>课程<br>属性<br>□强制□选修课程语言□英语█中文<br>信用时间3期48<br>学期□第一次秋季□第一次春季█第二次秋季□二春<br>□ 三季□第三弹□第四秋季□第四弹簧<br>导师李晓华，佐恒，孙吴阶平，朱虹<br>介绍<br>本课程涵盖彻底在本科关键数据结构<br>水平。重点关注如何评估成本和收益，它教会学生<br>如何创建高效的数据结构和算法，以及如何<br>应对新的设计挑战。</p>
<p>前提条件C语言编程<br>离散数学</p>
<p>教科书数据结构和算法分析的实践介绍，Clifford A.Shaffer<br>，Prentice Hall 2001.第二版<br>资源<br>①A.V.Aho，JEHopcroft和JDUllman，数据结构和算法，Addison - Wesley<br>Publishing Company，Inc.，1983<br>②Cliford A. Shaffer，数据结构与算法分析实践介绍 -<br>C ++）电子工业出版社。<br>分级任务，班级参与（40％），期末考试（60％）<br>专题</p>
<ol>
<li>数据结构和算法。1h<br>数据结构的哲学。抽象数据类型和数据结构。问题，算法<br>和程序。</li>
<li>数学初步 2h<br>2<br>ets和关系。杂项符号 对数。递归。总结和反复。<br>数学证明技术。估计。</li>
<li>算法分析。2h<br>简介 最佳，最差和平均的案例。更快的计算机，还是更快的算法？<br>渐近分析。计算程序的运行时间。分析问题 常见的<br>误解。多个参数。空间界限 一些实际注意事项</li>
<li>列表，堆栈和队列。10h<br>列表。词典ADT。堆栈。队列。</li>
<li>二叉树。6h<br>定义和属性。二叉树遍历。二叉树节点实现。二进制<br>搜索树。堆和优先队列。霍夫曼编码树。</li>
<li>非二叉树。4h<br>通用树定义和术语。父指针实现。一般树的<br>实现。Kary树。顺序树实现。</li>
<li>内部排序 5h<br>排序术语和符号。三… Q（n2<br>）排序算法。外壳排序。快速排序<br>合并排序 堆排序 Bin排序和基数排序。排序算法的实证比较。<br>下限排序。</li>
<li>文件处理和外部排序。2h<br>主要与次要存储。磁盘驱动器 缓冲池和缓冲池。程序员的<br>文件视图。外部排序。外部排序的简单方法。更换选择<br>多路合并</li>
<li>搜索。3h<br>搜索排序数组。自组织名单 搜索集合。散列。</li>
<li>索引。3h<br>线性索引。ISAM。树索引。2-3棵树。B-树。</li>
<li>图表。9h<br>术语和表示。图表实现。图形遍历。最短路径<br>问题。最小成本生成树。<br>3<br>总计：<br>讲座：47 QA：1<br>工具与<br>环境<br>本课程将需要使用VC ++ 6.0软件编程<br>项目<br>项目：城市数据库管理系统<br>要求：<br>1）使用BST或链接存储记录;<br>2）每个节点应包含城市的名称和城市的协调（用x，y表示）;<br>3）根据城市的名称组织数据库中的节点<br>4）根据名称或协调插入单个或多个节点，删除或索引节点。</li>
</ol>
<p>版本号：1.0<br>作者：李晓华<br>日期：2008-7-15<br>审计人<br>：梅红日期：2008-7-25 领导签名：日期：2008-7-30</p>
]]></content>
<summary type="html">
<p><strong>College of Software Engineering</strong><br><strong>Undergraduate Course Syllabus</strong><br>Course ID 311036030 Course Name Dat
</summary>
<category term="学" scheme="https://feahter.github.io/categories/%E5%AD%A6/"/>
<category term="考研" scheme="https://feahter.github.io/tags/%E8%80%83%E7%A0%94/"/>
<category term="算法设计" scheme="https://feahter.github.io/tags/%E7%AE%97%E6%B3%95%E8%AE%BE%E8%AE%A1/"/>
</entry>
<entry>
<title>研究生计算机网络大纲</title>
<link href="https://feahter.github.io/2017/05/17/%E7%A0%94%E7%A9%B6%E7%94%9F%E8%AE%A1%E7%AE%97%E6%9C%BA%E7%BD%91%E7%BB%9C%E5%A4%A7%E7%BA%B2/"/>
<id>https://feahter.github.io/2017/05/17/研究生计算机网络大纲/</id>
<published>2017-05-17T01:27:19.000Z</published>
<updated>2017-05-17T01:41:38.000Z</updated>
<content type="html"><![CDATA[<p><strong>College of Software Engineering</strong><br><strong>Undergraduate Course Syllabus</strong><br>Course ID 311015040 Course Name Computer Networks<br>Course<br>Attribute<br>■Compulsory □Selective Course Language ■English □Chinese<br>Credit Hour 4 Period 80<br>Semester □First Fall □First Spring □Second Fall ■Second Spring<br>□Third Fall □Third Spring □Fourth Fall □Fourth Spring<br>Instructors YANG Pin, RUAN Shuhua, LIN Feng<br>Description<br>This course provides an introduction to fundamental concepts in the design and implementation of<br>computer communication networks, their protocols, and applications. Topics to be covered<br>include: overview of network architectures, applications, network programming interfaces (e.g.,<br>sockets), transport, congestion, routing, and data link protocols, addressing, local area networks,<br>wireless networks, network security, and network management. Examples will be drawn primarily<br>from the Internet (e.g., TCP, UDP, and IP) protocol suite.<br>Prerequisites<br>C Language Programming<br>Data Structures & Algorithm<br>Operating System<br>Textbook Computer Networking: A Top Down Approach Featuring the Internet (3rd ed.), J.F. Kurose and<br>K.W. Ross, Addison-Wesley Longman.<br>Resource</p>
<ol>
<li>Computer Networks: A Systems Approach (4th Ed.), Larry L. Peterson and Bruce S. Davie,<br>China Machine Press, 2007</li>
<li>Computer Networks (4th ed.): Andrew S. Tanenbaum, Tsinghua University Press</li>
<li>TCP/IP Illustrated, Volume 1: The Protocols, W.Richard Stevens, China Machine Press, 2000</li>
<li>Unix Network Programming, Volume 1: Networking APIs: Sockets and XTI, W. Richard<br>Stevens, Tsinghua University Press, 1998</li>
<li>other related websites<br>Grading<br>Assignments (25%)<br>Projects(10%)<br>Lab.(15%)<br>Final exam (50%)<br>Topics<br>Part 1: Introduction (9H)<br>What is the Internet, What is a protocol?<br>The Network Edge, Core, and Access Networks<br>Physical Media<br>2<br>Delay and Loss in Packet-Switched Networks<br>Protocol Layers and Their Service Models<br>A Brief History of Computer Networking and the Internet<br>Part 2: The Application Layer (12H)<br>Principles of Application-Layer Protocols<br>The World Wide Web: HTTP<br>File Transfer: FTP<br>Electronic Mail in the Internet<br>The Internet’s Directory Service: DNS<br>Web Service (WSDL, SOAP, REST) (option)<br>Multimedia Applications (option)<br>Overlay Networks: Routing Overlay, P2P Networks, Content Distribution Networks<br>(option)<br>Socket Programming<br>PROGRAMMING ASSIGNMENT 1<br>Part 3: The Transport Layer (12H)<br> Transport-Layer Services and Principles<br> Multiplexing and Demultiplexing Applications<br> Connectionless Transport: UDP<br> Principles of Reliable of Data Transfer<br> TCP case study<br> PROGRAMMING ASSIGNMENT 2<br> Principles of Congestion Control<br> TCP Congestion Control<br>Part 4: The Network Layer (12H)<br> Introduction and Network Service Model<br> Routing Principles<br> Hierarchical Routing<br> IP: the Internet Protocol<br> Routing in the Internet<br> What is Inside a Router? (option)<br>Part 5: The Link Layer and Local Area Networks (9H)<br> The Data Link Layer: Introduction, Services<br> Error Detection and Correction<br> Multiple Access Protocols and LANs<br> LAN Addresses and ARP<br> Ethernet<br> PPP: the Point-to-Point Protocol<br> ATM (option)<br>Part 6: Wireless Networks (3H)<br> WiFi: IEEE 802.11<br> Handling Mobility<br> Case Study: GSM cellular networks, Mobile-IP<br>Part 7: Security in Computer Networks (option) (3H)<br> What is Network Security?<br> Attacks and Countermeasures<br>3<br> Principles of Cryptography<br> Authentication: Who are You?<br> Integrity<br> Key Distribution and Certification<br> Firewalls<br> Case Studies<br>Part 8: Network Management (option) (3H)<br> What is Network Management?<br> The Internet Network Management Framework<br> ASN.1<br>Tools &<br>Environment<br>Ethereal<br>WINDOWS 2003 SERVER, LINUX<br>Projects<br>Lab: (12H)</li>
<li>Ethereal</li>
<li>Configurations of DHCP Server, FTP Server, DNS Server and WEB Server</li>
<li>Switches and Routers<br>Project: (8H)<br>SOCKET COMMUNICATIONS</li>
<li>Multi-thread Web Server</li>
<li>Mail Client</li>
<li>Chat Room</li>
</ol>
<p>Version No： 1.0<br>Author： Pin Yang Date： 2008-7 -15<br>Auditor： Mei Hong Date： 2008-7-25<br>Signature of leader：<br>Date： 2008-7-30</p>
<h3 id="中文翻译："><a href="#中文翻译：" class="headerlink" title="中文翻译："></a>中文翻译：</h3><p><strong>软件工程学院</strong><br><strong>本科课程大纲</strong><br>课程编号311015040课程名称计算机网络<br>课程<br>属性<br>■强制□选修课程语言■英文□中文授课<br>时间4期80<br>学期□第一次秋季□ 初春□二秋■二春<br>□三秋□第三春□第四届秋季□第四届春季<br>导师杨Pin<br>阮书华林凤简介<br>本课程介绍了<br>计算机通讯网络及其协议及应用的设计与实现中的基本概念。要涵盖的主题<br>包括：网络架构，应用程序，网络编程接口（例如，<br>套接字），传输，拥塞，路由，<br>数据链路协议，寻址，局域网， 无线网络，网络安全和网络管理。实例主要<br>来自互联网（例如TCP，UDP和IP）协议套件。<br>前提<br>条件C语言编程<br>数据结构与算法<br>操作系统<br>教材计算机网络：自上而下的方法，具有互联网（第3版），JF Kurose和<br>K.W. 罗斯，艾迪生威斯利龙曼。<br>资源 前提条件C语言编程数据结构与算法操作系统教材计算机网络：自上而下的方法，具有互联网（第3版），JF Kurose和K.W. 罗斯，艾迪生威斯利龙曼。资源 前提条件C语言编程数据结构与算法操作系统教材计算机网络：自上而下的方法，具有互联网（第3版），JF Kurose和K.W. 罗斯，艾迪生威斯利龙曼。资源</p>
<ol>
<li>计算机网络：系统方法（第4版），Larry L. Peterson和Bruce S. Davie，<br>中国机械出版社，2007</li>
<li>计算机网络（第4版）：Andrew S. Tanenbaum，清华大学出版社</li>
<li>TCP / IP Illustrated，Volume 1：The Protocols，W.Richard Stevens，China Machine Press，2000</li>
<li>Unix网络编程，第1卷：网络API：套接字和XTI，W. Richard<br>Stevens，清华大学出版社，1998</li>
<li>其他相关网站<br>评分<br>分配（25％）<br>项目（10％）<br>实验室（15％）<br>期末考试（50％）<br>主题<br>第1部分：简介（9H）<br>什么是互联网，什么是协议？<br>网络边缘，核心和接入网络<br>物理媒体<br>2<br>分组交换网络中的延迟和丢失<br>协议层及其服务模型<br>计算机网络和互联网<br>的简史第2部分：应用层（12H）<br>应用层协议原理<br>万维网：HTTP<br>文件传输：<br>互联网中<br>的FTP 电子邮件Internet的目录服务：DNS<br>Web服务（WSDL，SOAP，互联网中的互联网协议路由什么是路由器内部？（选项）第5部分：链路层和局域网（9H）数据链路层：简介，服务错误检测和纠正多路访问协议和LAN LAN地址和ARP 以太网PPP：点到点协议ATM ）第6部分：无线网络（3G ）WiFi：IEEE 802.11 处理移动性案例研究：GSM蜂窝网络，移动IP 第7部分：计算机网络中的安全（可选）（3H）什么是网络安全？攻击与对策3 加密认证原则：你是谁？完整性密钥分发和认证防火墙案例研究第8部分：网络管理（可选）（3H）什么是网络管理？互联网管理框架ASN.1 工具与环境Ethereal WINDOWS 2003 SERVER，LINUX 项目实验室：（12H）</li>
<li>空灵</li>
<li>DHCP服务器，FTP服务器，DNS服务器和WEB服务器的配置</li>
<li>开关和路由器<br>项目：（8H）<br>插座通信</li>
<li>多线程Web服务器</li>
<li>邮件客户端</li>
<li>聊天室</li>
</ol>
<p>版本号：1.0<br>作者：Pin Yang<br>日期：2008-7-15审核员：梅红日期：2008-7-25<br>领导签名：<br>日期：2008-7-30</p>
]]></content>
<summary type="html">
<p><strong>College of Software Engineering</strong><br><strong>Undergraduate Course Syllabus</strong><br>Course ID 311015040 Course Name Com
</summary>
<category term="学" scheme="https://feahter.github.io/categories/%E5%AD%A6/"/>
<category term="考研" scheme="https://feahter.github.io/tags/%E8%80%83%E7%A0%94/"/>
<category term="计算机网络" scheme="https://feahter.github.io/tags/%E8%AE%A1%E7%AE%97%E6%9C%BA%E7%BD%91%E7%BB%9C/"/>
</entry>
<entry>
<title>研究生操作系统大纲</title>
<link href="https://feahter.github.io/2017/05/17/%E7%A0%94%E7%A9%B6%E7%94%9F%E6%93%8D%E4%BD%9C%E7%B3%BB%E7%BB%9F%E5%A4%A7%E7%BA%B2/"/>
<id>https://feahter.github.io/2017/05/17/研究生操作系统大纲/</id>
<published>2017-05-17T01:27:01.000Z</published>
<updated>2017-05-17T01:47:44.000Z</updated>
<content type="html"><![CDATA[<p><strong>College of Software Engineering</strong><br><strong>Undergraduate Course Syllabus</strong><br>Course ID 311006040 Course Name Operating System<br>Course<br>Attribute<br>■Compulsory □Selective Course Language ■English ■Chinese<br>Credit Hour 4 Period 64<br>Semester □First Fall □First Spring □Second Fall ■Second Spring<br>□Third Fall □Third Spring □Fourth Fall □Fourth Spring<br>Instructors Zhao Kui, Liang Gang, Hu Xiao-qin<br>Description<br>This course covers the fundamentals of Operating Systems and Systems<br>Programming, revealing the mysteries of the software layer between application<br>programs and hardware, and covering techniques and algorithms for dealing with<br>thorny problems of resource management, sharing, and protection, as well as<br>concurrency and complex systems. Perhaps best of all, four programming projects<br>give students the chance to implement important and realistic subsystems of a small<br>operating system kernel.<br>Between the lectures, reading, and programming assignments, we hope that the course<br>will help students become not only an OS expert and/or kernel hacker, but also a<br>better programmer and user of computer systems, and a better computer scientist who<br>has insight into managing complex and concurrent interactions within and between<br>hardware and software systems!<br>Prerequisites<br>C Language Programming<br>Computer Architecture<br>Data Structures and Algorithms</p>
<p>Textbook William Stallings, Operating Systems Internals and Design Principles (Fifth Edition),Publish<br>House of Electronics Industry,2007<br>2<br>Resource<br>• Course Webpage: cs.scu.edu.cn/~zhaokui<br>All vital information will appear on the course webpage, including lecture<br>notes and programming assignments.<br>• Mailing list: [email protected]<br> [email protected]<br> [email protected]<br>The staff email is where you should send questions regarding course<br>administration and any questions which would be inappropriate if posted<br>publicly to the newsgroup (i.e. questions that contain your code or other<br>private information).<br>• Reference:</p>
<ol>
<li>Computing Operating System tangziyin, Xian University of Electronic Science and<br>Technology Press 出版社, 2004,Edition 3.</li>
<li>Operating System：Design and Implementation，Andrew S.Tanenbaum,Pulishing<br>House of Electronics Industry，1998，Edition 2.</li>
<li>Operating System，Harvey M.Deitel, Tsingha University Press，2007，Edition 3.</li>
<li>Operating System Concepts ， James L.Peterson ， Addison-Wesley Publishing<br>Company，2001,Edition 6.</li>
<li>Operating Systems Concepts, Abraham Silberschatz, Peter Galvin, and Greg Gagne,<br>John Wiley and Sons, Higher Education Press, 2002，Edition 6.</li>
<li>Operationg System—Excise and Analyze ，ZengPing，Tsingha University Press，<br>2001，Edition 1</li>
<li>Williamstallings.com/os/os5e.html</li>
<li>Comp.os.research</li>
<li>comp.os.misc</li>
<li>comp.unix.internals</li>
<li>comp.os.linux.development.system</li>
<li><a href="http://ocw.zju.edu.cn/OcwWeb/index.jsp" target="_blank" rel="external">http://ocw.zju.edu.cn/OcwWeb/index.jsp</a><br>Grading</li>
</ol>
<p>Class participation and homework (30%), final exam (50%), course practice(20)</p>
<p>3<br>Topics<br>(48 credit<br>hours)<br>The lecture of this course will cover the following topics:</p>
<ol>
<li>Computer System Overview (1 credit hours)<br>º .Overview of computer architecture and organization;<br>º Computer-System Operation;<br>º Interrupts;<br>º The memory of hierarchy;<br>º I/O communication techniques</li>
<li>Operating System Overview (3 credit hours)<br>º History of operating system;<br>º Operating system concepts, objective and function;<br>º Introduction of the type of Operating system including multiprogramming system,<br>Real-Time System, Batch system, Time-sharing system, Distributed operating system,<br>Network operating system<br>º Overview of the modern operating system structure;</li>
<li>Process Description and Control (5 credit hours)<br>º The concepts of process including states and its transitions, PCB;<br>º The operations on processes and process states;<br>º Introduction of process control;</li>
<li>Threads, SM and Microkernels ( 5 credit hours )<br>º Thread definition, creation, manipulation, User and Kernel Thread.;<br>º The concept of SMP and the management of SMP;<br>º Microlekernels definition, objective;</li>
<li>Concurrency ( 9 credit hours )<br>º The conceptions of concurrency and the implication of execution of multiple<br>concurrent process;<br>º The hardware mechanisms that support mutual exclusion;<br>º Three operating system and programming language mechanisms used to provide<br>concurrency;<br>º Introduction two problems of concurrency: deadlock and starvation and solutions of<br>these two problems.</li>
<li>Memory ( 9 credit hours )<br>º Memory organization and management;<br>4<br>º Paging and segmentation, address mapping;<br>º Virtual memory concepts;<br>º Virtual memory management, page replacement algorithms.</li>
<li>Scheduling (9 credit hours )<br>º Basic Concepts (including Long-term scheduling, Medium-term scheduling,<br>Short-term scheduling.);<br>º Scheduling algorithms(including First-Come-First-Served (FCFS), Priority,<br>Round-Robin );<br>º Multiprocessor scheduling;<br>º Real-Time Scheduling;</li>
<li>Input/Output Device ( 4 credit hours )<br>º The concepts relation to I/O devices and the classification of the I/O devices;<br>º The task and function of the I/O device management;<br>º The data structure and algorithms relation to I/O device management;<br>º The virtual device techniques;</li>
<li>File Management ( 3 credit hours )<br>º File Concept, Access Methods, Directory Structure, File Sharing and Protection<br>º File-System Structure, File-System Implementation, Directory Implementation,<br>Allocation Methods, Free-Space Management.<br>Tools &<br>Environment<br>Windows XP, Redhat linux 9.0, Vmware virtual machine, gcc, g++<br>Projects<br>( 16 credit<br>hours )<br>Lab 1: Develop a shell in Nachos<br>Requirement:<br>º Design a simples command line shell that has following properties:</li>
<li>The shell must support the following internal commands: cd , dir, clr,environ,<br>echo ,help ,pause and quit;</li>
<li>All other command line input is interpreted as program invocation which should<br>be done by the shell forking and executing the programs as its own child<br>processes;</li>
<li>The shell must be able to take its command line input from a file;<br>5</li>
<li>The shell must support i/o redirection on either or both stdin and/or stdout;</li>
<li>The shell must support background execution of programs.</li>
<li>The command line prompt must contain the pathname of the current directory.<br>º Write a simple manual describing how to use the shell. The manual should contain<br>enough detail for a beginner to linux to use it;<br>º The source code must be extensively commented and appropriately structured to<br>allow your peers to understand and easily maintain the code;<br>º Details of submission procedures will be supplied well before the deadlines;<br>º The submission should contain only source code files, include files, a makefile and<br>the readme file.<br>Lab 2: Upgrade the Nachos thread management model<br>Requirement:<br>Modify the source code of the Nachos to achieve the following objectives:<br>º Expand thread data structure and add the “user ID, thread ID” two members of the<br>data structure of Nachos. Meanwhile, add the safeguard mechanism of these two data<br>members in the Nachos existing thread management model;<br>º Expand the existing state of threads. There are only “new”, “ready”, “block” and<br>“running” four states in Nachos. Please add “suspending” state in Nachos. The<br>so-called “hang up” refers to the current thread disk image stored in documents rather<br>than memory. “Suspend” state is the important foundation of the future realization of<br>virtual memory management.<br>º Modify thread scheduling algorithm. Change the thread management mechanism to<br>the “preemptive.” You can add “timing” and “priority scheduling,” “Multi-Queue”<br>different algorithm into Nachos thread management model.<br>º Add the global thread management mechanism and expand the existing operations<br>command in Nachos. For example, you can add a command called “ThreadView” in<br>order to show the current existence of all the threads of information, including the<br>“user ID”, “Thread ID”, “Current status” on the screen.<br>º Design a mutual exclusion and synchronization example. After the above<br>modifications, you can design a program to implement one mutual exclusion and<br>synchronization classic solution. For example, you can choose “philosopher dining”<br>problem and create five philosopher threads which have same user ID and follow the<br>“signal of” mechanisms to correct the operation in your program. You can also choose<br>“producers - consumers”, “Sleep Barber of Seville” and other classic IPC problems to<br>6<br>finish this task.<br>Lab 3: Upgrade the Nachos File management model<br>Requirement:<br>Modify the source code of the Nachos to achieve the following objectives:<br>º Add longer document name support and the following described information in<br>Nachos kernel.<br>File Types<br>Create time<br>Document the last visit time<br>File trails<br>º Achieve dynamic content distribution according to the file size. Now，Nachos allocate<br>the space according to the designated size of when creating a file and if we want to<br>amend file, we are limited to allocated space. So, modify the kernel to satisfy the<br>dynamic distribution.<br>º Modify the file index means in Nachos to achieve unlimited length of documents. You<br>can refer to the file index mechanism of Unix to achieve this requirement.<br>º Modify the directory structure to implement multi-level directory which there is no<br>restriction on the number of the files.<br>º Achieve synchronous operation of the file system. Directory files, bitmap files are all<br>critical resources and they do not allow multiple processes at the same time visit. The<br>current system did not impose synchronous control, so, modify this defect.<br>Lab 4: Upgrade the Nachos Memory management model<br>Requirement:<br>Modify the source code of the Nachos to achieve the following objectives:<br>º Add the data structure to describe the process of memory and the corresponding<br>relations. That is, add the “process ID” member in memory describing structure and it<br>can make understand the distribution of memory easily and facilitate to measure the<br>performance of memory management.<br>º Achieve the multi-programming, which there are multiple programs co-exist in<br>memory.<br>º Modify the Nachos to support virtual memory. Nachos only support the process<br>which it’s size is not more than the size of the memory. If the size of process is more<br>7<br>than the size of the memory, it will not be execute. So, amend this defect to support<br>big size process.<br>º Implementation monitoring thread and it can real-time reflect the use of memory.</li>
</ol>
<p>Version No： 1.0<br>Author： Kui Zhao Date： 2008-7 -15<br>Auditor： Mei Hong Date： 2008-7-25<br>Signature of leader：<br>Date： 2008-7-30</p>
<h3 id="中文翻译："><a href="#中文翻译：" class="headerlink" title="中文翻译："></a>中文翻译：</h3><p>软件工程学院<br>本科课程大纲<br>课程ID 311006040课程名称操作系统<br>课程<br>属性<br>■强制□选修课程语言■英文■中文<br>信用小时4期64<br>学期□第一次秋季□初春□二秋■二春<br>□三秋□第三泉□第四秋□第四春<br>导师赵奎梁良胡晓琴<br>描述<br>本课程涵盖了操作系统和系统的基础知识<br>编程，揭示应用程序之间软件层的奥秘<br>程序和硬件，并涵盖处理的技术和算法<br>资源管理，共享和保护的棘手问题，以及<br>并发和复杂系统。也许最重要的是四个编程项目<br>让学生有机会实现一个小型的重要和现实的子系统<br>操作系统内核。<br>在讲座，阅读和编程任务之间，我们希望这个课程<br>将帮助学生成为不仅仅是操作系统专家和/或内核黑客，而且也是一个<br>更好的程序员和计算机系统用户，以及更好的计算机科学家<br>有洞察力来管理内部和内部的复杂和并发交互<br>硬件和软件系统！<br>先决条件<br>C语言编程<br>计算机体系结构<br>数据结构和算法</p>
<p>教材William Stallings，操作系统内部和设计原则（第五版），发布<br>电子工业之家，2007年<br>2<br>资源<br>•课程网页：cs.scu.edu.cn/~zhaokui<br>所有重要信息将显示在课程网页上，包括讲座<br>笔记和编程作业。<br>•邮寄名单：[email protected]<br>[email protected]<br>[email protected]<br>工作人员电子邮件是您应该在哪里发送有关课程的问题<br>管理和任何不适当的问题，如果发布<br>公开给新闻组（即包含你的代码或其他的问题）<br>私人信息）。<br>•参考：</p>
<p>西安电子科技大学计算机操作系统tangziyin<br>技术出版社出版社，2004，第3版。<br>操作系统：设计和实现，Andrew S.Tanenbaum，Pulishing<br>电子工业之家，1998年版，第2版。<br>操作系统，Harvey M.Deitel，青海大学出版社，2007年3版。<br>操作系统概念，James L.Peterson，Addison-Wesley Publishing<br>公司，2001年，第6版。<br>操作系统概念，Abraham Silberschatz，Peter Galvin和Greg Gagne，<br>John Wiley and Sons，Higher Education Press，2002，Edition 6。<br>清华大学出版社，曾平，<br>2001，第1版</p>
<p>教材William Stallings，操作系统内部和设计原理（第五版），<br>2007年电子工业出版社<br>2<br>资源<br>•课程网页：cs.scu.edu.cn/~zhaokui<br>所有重要信息将显示在课程网页上，包括讲座<br>笔记和编程作业。<br>•邮寄名单：[email protected]<br>[email protected]<br>[email protected]<br>工作人员电子邮件是您应该在哪里发送有关课程<br>管理的问题和任何不恰当的问题如果<br>公开发布到新闻组（即包含您的代码或其他<br>私人信息的问题）。<br>•参考：</p>
<ol>
<li>西安电子科技大学计算机<br>操作系统tangziyin出版社，2004，第3版。</li>
<li>操作系统：设计与实现，Andrew S.Tanenbaum，<br>电子工业制造所，1998年版，第2版。</li>
<li>操作系统，Harvey M.Deitel，青海大学出版社，2007年3版。</li>
<li>操作系统概念，James L.Peterson，Addison-Wesley Publishing<br>Company，2001，第6版。</li>
<li>操作系统概念，Abraham Silberschatz，Peter Galvin和Greg Gagne，<br>John Wiley and Sons，Higher Education Press，2002，Edition 6。</li>
<li>青岛大学出版社，<br>2001版，第1版</li>
<li>Williamstallings.com/os/os5e.html</li>
<li>Comp.os.research</li>
<li>comp.os.misc</li>
<li>comp.unix.internals</li>
<li>comp.os.linux.development.system</li>
<li><a href="http://ocw.zju.edu.cn/OcwWeb/index.jsp" target="_blank" rel="external">http://ocw.zju.edu.cn/OcwWeb/index.jsp</a><br>评分</li>
</ol>
<p>班级参与和作业（30％），期末考试（50％），课程实践（20）</p>
<p>3<br>课程<br>（48学分<br>）<br>本课程的讲座将涵盖以下主题：</p>
<ol>
<li>计算机系统概述（1学时）<br>º。计算机体系结构和组织概况;<br>º计算机系统操作;<br>º中断;<br>º层次记忆;<br>ºI / O通信技术</li>
<li>操作系统概述（3学分）<br>º操作系统历史;<br>º操作系统概念，目标和功能;<br>º介绍操作系统类型，包括多编程系统，<br>实时系统，批处理系统，分时系统，分布式操作系统，<br>网络操作系统<br>º现代操作系统结构概述;</li>
<li>过程描述和控制（5学分）<br>º过程概念包括状态及其过渡，PCB;<br>º对过程和过程状态的操作;<br>º过程控制介绍;</li>
<li>线程，SM和微内核（5学分）<br>º线程定义，创建，操作，用户和内核线程;<br>ºSMP的概念和SMP的管理;<br>ºMicrolekernels定义，客观;</li>
<li>并发（9个小时）<br>º并发的概念和多个<br>并发进程的执行的含义;<br>º支持互斥的硬件机制;<br>º用于提供<br>并发的三种操作系统和编程语言机制;<br>º引入并发的两个问题：死锁和饥饿以及<br>这两个问题的解决方案。</li>
<li>记忆（9个小时）<br>º记忆组织与管理;<br>4<br>º寻呼和分割，地址映射;<br>º虚拟内存概念;<br>º虚拟内存管理，页面替换算法。</li>
<li>计划（9个小时）<br>º基本概念（包括长期调度，中期调度，<br>短期调度）。<br>º调度算法（包括先到先得（FCFS），优先级，<br>循环）;<br>º多处理器调度;<br>º实时调度;</li>
<li>输入/输出设备（4个小时）<br>º与I / O设备的概念关系和I / O设备的分类;<br>ºI / O设备管理的任务和功能;<br>º数据结构和算法与I / O设备管理的关系;<br>º虚拟设备技术;</li>
<li>文件管理（3个小时）<br>º文件概念，访问方法，目录结构，文件共享和保护<br>º文件系统结构，文件系统实现，目录实现，<br>分配方法，自由空间管理。<br>工具和<br>环境<br>Windows XP，Redhat linux 9.0，Vmware虚拟机，gcc，g ++<br>项目<br>（16学分<br>）<br>实验1：在<br>玉米片中开发shell 要求：<br>º设计具有以下属性的simples命令行shell：</li>
<li>shell必须支持以下内部命令：cd，dir，clr，environ，<br>echo，help，pause and quit;</li>
<li>所有其他命令行输入被解释为程序调用，应该<br>由shell执行程序调用并执行程序作为其自己的子<br>进程;</li>
<li>shell必须能够从文件中获取其命令行输入;<br>五</li>
<li>shell必须在stdin和/或stdout两者之一上支持i / o重定向;</li>
<li>shell必须支持程序的后台执行。</li>
<li>命令行提示必须包含当前目录的路径名。<br>º写一个简单的手册来描述如何使用shell。手册应该包含<br>足够的细节，让初学者使用linux来使用它;<br>º源代码必须进行广泛的评论和适当的结构，以<br>允许对等体了解并轻松维护代码;<br>º提交程序详情将在截止日期前提供;<br>º提交内容只能包含源代码文件，包含文件，makefile和<br>自述文件。<br>实验2：升级Nachos线程管理模型<br>要求：<br>修改Nachos的源代码，实现以下目标：<br>º扩展线程数据结构，并添加“用户ID”<br>线程ID“两个成员的数据结构的玉米片。同时，将这两个数据<br>成员的保护机制加入到现有的线程管理模型中;<br>º展开线程的现有状态。<br>玉米片中只有“新”，“准备好”，“封锁”和“跑”了四个州。请在玉米片中添加“暂停”状态。在<br>所谓的“挂机”是指存储在文档中，而当前线程的磁盘映像<br>比内存。“暂停”状态是未来<br>虚拟内存管理实现的重要基础。<br>º修改线程调度算法。将线程管理机制更改为<br>“抢先”。您可以<br>在Nachos线程管理模型中添加“定时”和“优先级调度”，“多队列” 等不同算法。<br>º添加全局线程管理机制，并<br>在Nachos中展开现有操作命令。例如，您可以添加一个名为“ThreadView”的<br>命令，以显示当前存在的所有线程的信息，包括屏幕上的<br>“用户ID”，“线程ID”，“当前状态”。<br>º设计互斥和同步示例。经过上述<br>修改，您可以设计一个程序来实现一个互斥和<br>同步的经典解决方案。例如，您可以选择“哲学家餐饮”<br>问题，并创建具有相同用户ID的五位哲学家线索，并遵循<br>“机制信号”来纠正程序中的操作。您也可以选择<br>“生产者 - 消费者”，<br>“塞维利亚睡眠理发师”等经典IPC问题6<br>完成此任务。<br>实验3：升级Nachos文件管理模型<br>要求：<br>修改Nachos的源代码以实现以下目标：<br>º在<br>Nachos内核中添加更多文档名称支持和以下描述的信息。<br>文件类型<br>创建时间<br>记录上次访问时间<br>文件路径<br>º根据文件大小实现动态内容分发。现在，Nachos根据<br>创建文件的指定大小分配空间，如果我们要<br>修改文件，我们仅限于分配的空间。所以，修改内核以满足<br>动态分布。<br>º修改Nachos中的文件索引，以实现无限长的文档。您<br>可以参考Unix的文件索引机制来实现这一要求。<br>º修改目录结构以实现多级目录，<br>对文件数量没有限制。<br>º实现文件系统的同步操作。目录文件，位图文件都是<br>关键资源，它们不允许多个进程同时访问。在<br>现行制度没有实行同步控制，因此，修改此缺陷。<br>实验4：升级Nachos内存管理模型<br>要求：<br>修改Nachos的源代码，实现以下目标：<br>º添加数据结构来描述内存的过程和相应的<br>关系。也就是说，将“进程ID”成员添加到内存描述结构中，<br>可以轻松<br>了解内存分配，便于测量内存管理的性能。<br>º实现多编程，<br>内存中共存有多个程序。<br>º修改Nachos以支持虚拟内存。玉米片只支持其<br>大小不超过内存大小的进程。如果进程的大小比内存的大小多<br>7<br>，那么它将不会执行。所以，修改这个缺陷来支持<br>大尺寸的过程。<br>º执行监控线程，可以实时反映内存的使用情况。</li>
</ol>
<p>版本号：1.0<br>作者：<br>崔<br>钊日期：2008-7-15 审计人<br>：梅红日期：2008-7-25 领导签名：日期：2008-7-30</p>
]]></content>
<summary type="html">
<p><strong>College of Software Engineering</strong><br><strong>Undergraduate Course Syllabus</strong><br>Course ID 311006040 Course Name Ope
</summary>
<category term="学" scheme="https://feahter.github.io/categories/%E5%AD%A6/"/>
<category term="考研" scheme="https://feahter.github.io/tags/%E8%80%83%E7%A0%94/"/>
<category term="操作系统" scheme="https://feahter.github.io/tags/%E6%93%8D%E4%BD%9C%E7%B3%BB%E7%BB%9F/"/>
</entry>
<entry>
<title>研究生数据结构大纲</title>
<link href="https://feahter.github.io/2017/05/17/%E7%A0%94%E7%A9%B6%E7%94%9F%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84%E5%A4%A7%E7%BA%B2/"/>
<id>https://feahter.github.io/2017/05/17/研究生数据结构大纲/</id>
<published>2017-05-17T01:26:37.000Z</published>
<updated>2017-05-17T01:36:36.000Z</updated>
<content type="html"><![CDATA[<p><strong>College of Software Engineering</strong><br><strong>Undergraduate Course Syllabus</strong><br>Course ID 311036030 Course Name Data Structures & Algorithm<br>Course<br>Attribute<br>□Compulsory □Selective Course Language □English █Chinese<br>Credit Hour 3 Period 48<br>Semester □First Fall □First Spring █Second Fall □Second Spring<br>□Third Fall □Third Spring □Fourth Fall □Fourth Spring<br>Instructors Li xiaohua，Zuo hang，Sun Jieping, Zhu Hong<br>Description<br>This course thoroughly covers key data structures at the undergraduate<br>level. With a focus on how to assess costs and benefits, it teaches students<br>how to create efficient data structures and algorithms and how to adopt<br>to new design challenges. Students are taught how to assess applications<br>needs to find data structures with matching capabilities.</p>
<p>Prerequisites C Language Programming<br>Discrete Mathematics</p>
<p>Textbook A Practical Introduction to Data Structures and Algorithm Analysis，Clifford A.<br>Shaffer，Prentice Hall 2001. Second Edition<br>Resource<br>①A.V.Aho,J.E.Hopcroft and J.D.Ullman,Data Structures and Algorithms,by Addison——Wesley<br>Publishing Company,Inc.,1983<br>② Cliford A. Shaffer，A Practical Introduction to Data Structures and Algorithm Analysis——<br>C++)，Publishing house of electronics industry.<br>Grading assignments, class participation (40%), final exam (60%)<br>Topics</p>
<ol>
<li>Data Structures and Algorithms. 1h<br>A Philosophy of Data Structures. Abstract Data Types and Data Structures. Problems, Algorithms,<br>and Programs.</li>
<li>Mathematical Preliminaries. 2h<br>2<br>ets and Relations. Miscellaneous Notation. Logarithms. Recursion. Summations and Recurrences.<br>Mathematical Proof Techniques. Estimating.</li>
<li>Algorithm Analysis. 2h<br>Introduction. Best, Worst, and Average Cases. A Faster Computer, or a Faster Algorithm?<br>Asymptotic Analysis. Calculating the Running Time of a Program. Analyzing Problems. Common<br>Misunderstandings. Multiple Parameters. Space Bounds. Some Practical Considerations.</li>
<li>Lists, Stacks, and Queues. 10h<br>Lists. The Dictionary ADT. Stacks. Queues.</li>
<li>Binary Trees. 6h<br>Definitions and Properties. Binary Tree Traversals. Binary Tree Node Implementations. Binary<br>Search Trees. Heaps and Priority Queues. Huffman Coding Trees.</li>
<li>Non-Binary Trees. 4h<br>General Tree Definitions and Terminology. The Parent Pointer Implementation. General Tree<br>Implementations. K -ary Trees. Sequential Tree Implementations.</li>
<li>Internal Sorting. 5h<br>Sorting Terminology and Notation. Three …Q(n2<br>) Sorting Algorithms. Shell sort. Quick sort.<br>Merge sort. Heap sort. Bin sort and Radix Sort. An Empirical Comparison of Sorting Algorithms.<br>Lower Bounds for Sorting.</li>
<li>File Processing and External Sorting. 2h<br>Primary versus Secondary Storage. Disk Drives. Buffers and Buffer Pools. The Programmer’s<br>View of Files. External Sorting. Simple Approaches to External Sorting. Replacement Selection.<br>Multi-way Merging.</li>
<li>Searching. 3h<br>Searching Sorted Arrays. Self-Organizing Lists. Searching in Sets. Hashing.</li>
<li>Indexing. 3h<br>Linear Indexing. ISAM. Tree Indexing. 2-3 Trees. B-Trees.</li>
<li>Graphs. 9h<br>Terminology and Representations. Graph Implementations. Graph Traversals. Shortest-Paths<br>Problems. Minimum-Cost Spanning Trees.<br>3<br>Total:<br>Lecture: 47 QA: 1<br>Tools &<br>Environment<br>This course will require to use VC++ 6.0 software for programming<br>Projects<br>Project: City database Management System<br>Requirements:<br>1） Using BST or linked lis t to store the records；<br>2） Each node should contain the name of city and the coordination of city(denoted using x,y)；<br>3） Organize the node in database according to the name of city<br>4） Insert single or multiple nodes, delete or index node in accordance with name or coordination.<br>5） Print all records which have certain distance with a given city<br>6） Statistic the runtime of each operation<br>7) encourage adding in innovate functions<br>Development environment:<br>VC++ 6.0</li>
</ol>
<p>Version No： 1.0<br>Author： Xiaohua Li Date： 2008-7 -15<br>Auditor： Mei Hong Date： 2008-7-25<br>Signature of leader：<br>Date： 2008-7-30</p>
<h3 id="中文翻译："><a href="#中文翻译：" class="headerlink" title="中文翻译："></a>中文翻译：</h3><p><strong>软件工程学院</strong><br><strong>本科课程大纲</strong><br>课程编号311036030课程名称数据结构与算法<br>课程<br>属性<br>□强制□选修课程语言□英语█中文<br>信用时间3期48<br>学期□第一次秋季□第一次春季█第二次秋季□二春<br>□ 三季□第三弹□第四秋季□第四弹簧<br>导师李晓华，佐恒，孙吴阶平，朱虹<br>介绍<br>本课程涵盖彻底在本科关键数据结构<br>水平。重点关注如何评估成本和收益，它教会学生<br>如何创建高效的数据结构和算法，以及如何<br>应对新的设计挑战。</p>
<p>前提条件C语言编程<br>离散数学</p>
<p>教科书数据结构和算法分析的实践介绍，Clifford A.Shaffer<br>，Prentice Hall 2001.第二版<br>资源<br>①A.V.Aho，JEHopcroft和JDUllman，数据结构和算法，Addison - Wesley<br>Publishing Company，Inc.，1983<br>②Cliford A. Shaffer，数据结构与算法分析实践介绍 -<br>C ++）电子工业出版社。<br>分级任务，班级参与（40％），期末考试（60％）<br>专题</p>
<ol>
<li>数据结构和算法。1h<br>数据结构的哲学。抽象数据类型和数据结构。问题，算法<br>和程序。</li>
<li>数学初步 2h<br>2<br>ets和关系。杂项符号 对数。递归。总结和反复。<br>数学证明技术。估计。</li>
<li>算法分析。2h<br>简介 最佳，最差和平均的案例。更快的计算机，还是更快的算法？<br>渐近分析。计算程序的运行时间。分析问题 常见的<br>误解。多个参数。空间界限 一些实际注意事项</li>
<li>列表，堆栈和队列。10h<br>列表。词典ADT。堆栈。队列。</li>
<li>二叉树。6h<br>定义和属性。二叉树遍历。二叉树节点实现。二进制<br>搜索树。堆和优先队列。霍夫曼编码树。</li>
<li>非二叉树。4h<br>通用树定义和术语。父指针实现。一般树的<br>实现。Kary树。顺序树实现。</li>
<li>内部排序 5h<br>排序术语和符号。三… Q（n2<br>）排序算法。外壳排序。快速排序<br>合并排序 堆排序 Bin排序和基数排序。排序算法的实证比较。<br>下限排序。</li>
<li>文件处理和外部排序。2h<br>主要与次要存储。磁盘驱动器 缓冲池和缓冲池。程序员的<br>文件视图。外部排序。外部排序的简单方法。更换选择<br>多路合并</li>
<li>搜索。3h<br>搜索排序数组。自组织名单 搜索集合。散列。</li>
<li>索引。3h<br>线性索引。ISAM。树索引。2-3棵树。B-树。</li>
<li>图表。9h<br>术语和表示。图表实现。图形遍历。最短路径<br>问题。最小成本生成树。<br>3<br>总计：<br>讲座：47 QA：1<br>工具与<br>环境<br>本课程将需要使用VC ++ 6.0软件编程<br>项目<br>项目：城市数据库管理系统<br>要求：<br>1）使用BST或链接存储记录;<br>2）每个节点应包含城市的名称和城市的协调（用x，y表示）;<br>3）根据城市的名称组织数据库中的节点<br>4）根据名称或协调插入单个或多个节点，删除或索引节点。</li>
</ol>
<p>版本号：1.0<br>作者：李晓华<br>日期：2008-7-15<br>审计人<br>：梅红日期：2008-7-25 领导签名：日期：2008-7-30</p>
]]></content>
<summary type="html">
<p><strong>College of Software Engineering</strong><br><strong>Undergraduate Course Syllabus</strong><br>Course ID 311036030 Course Name Dat
</summary>
<category term="学" scheme="https://feahter.github.io/categories/%E5%AD%A6/"/>
<category term="数据结构" scheme="https://feahter.github.io/tags/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84/"/>
<category term="考研" scheme="https://feahter.github.io/tags/%E8%80%83%E7%A0%94/"/>
</entry>
<entry>
<title>研究生数据结构重点</title>
<link href="https://feahter.github.io/2017/05/12/%E7%A0%94%E7%A9%B6%E7%94%9F%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84%E9%87%8D%E7%82%B9/"/>
<id>https://feahter.github.io/2017/05/12/研究生数据结构重点/</id>
<published>2017-05-12T06:33:53.000Z</published>
<updated>2017-05-12T07:21:04.000Z</updated>
<content type="html"><![CDATA[<p>一、线性表</p>
<p>链表插入、删除节点时的指针操作（选择题）；</p>
<p>双向链表等一些相对复杂的链表的操作（综合应用题）。</p>
<p>二、栈、队列和数组</p>
<p>1.栈与队列FILO和FIFO的特点。</p>
<p>针对栈FILO的特点，进栈出栈序列（选择题）；</p>
<p>2.栈和队列的顺序和链式存储结构：</p>
<p>不同存储结构下栈顶指针、队首指针以及队尾指针的操作。</p>
<p>循环队列判满和判空的2种判断方法。</p>
<p>3.特殊矩阵的压缩存储：</p>
<p>二维矩阵与一维数组相互转换时，下标的计算方法，</p>
<p>与对角线平行的若干行上数据非零的矩阵存放在一维数组后，各个数据点相应的下标的计算。</p>
<p>4.利用堆栈或队列的特性，将它们作为基础的数据结构，支持实际问题求解算法的设计。</p>
<p>用栈解决递归问题，用队列解决图的遍历问题（综合应用题）。</p>
<p>三、树和二叉树。</p>
<p>1.树、二叉树的各种性质、树和二叉树的不同存储结构、森林、树和二叉树之间的转换、线索化二叉树、二叉树的应用（二叉排序树、平衡二叉树和Huffman树）。</p>
<p>森林、树以及二叉树的前中后三种遍历方式。要能进行相应的算法设计。</p>
<p>选择题考点：</p>
<p>1.满二叉树、完全二叉树节点数的计算。</p>
<p>2.由树、二叉树的示意图给出相应的遍历序列，依据二叉树的遍历序列还原二叉树。</p>
<p>3.线索化的实质。</p>
<p>计算采用不同的方法线索化后二叉树剩余空指针域的个数，平衡二叉树的定义、性质、建立和四种调整算法以及回溯法相关的问题。</p>
<p>综合应用题考点：</p>
<p>二叉树的遍历算法，遍历基础上针对二叉树的一些统计和操作（比如结点数统计、左右子树对换等等）。</p>
<p>判断某棵二叉树是否二叉排序树，</p>
<p>以上这些都要求能用递归的和非递归的算法解决，特别要重视非递归的算法，线索化后二叉树的遍历算法，如查找某结点线索化后的前驱或后继结点的算法以及给出Huffman编码等等。</p>
<p>四、图。</p>
<p>图以及基于图的各种定义，存储方式。</p>
<p>本章重点：要熟练掌握图的深度遍历和广度遍历算法，这是用图来解决应用问题时常用的算法基础。需要掌握基于图的多个算法，能够以手工计算的方式在一个给定的图上执行特定的算法求解问题。</p>
<p>常见的应用问题直接给出或经过抽象，会成为下列问题：</p>
<p>最小生成树求解（PRIM算法和KRUSKAL算法，两种方法思想都很简单，但要注意不要混淆这两种方法），</p>
<p>拓扑排序问题（这里会用到数组实现的链表，可以注意一下），</p>
<p>关键路径问题（数据结构的较大难点，要把概念理解透，能做出表格找出关键路径），</p>
<p>最短路径问题（有重要的应用背景，也是贪心法不多的能给出最优解的典型问题之一）。</p>
<p>五、查找。</p>
<p>关键字、主关键字、次关键字的含义；</p>
<p>本章重点：静态查找与动态查找的含义及区别；平均查找长度ASL的概念及在各种查找算法中的计算方法和计算结果，特别是一些典型结构的ASL值，B树的概念和基本操作冲突解决方法的选择和冲突处理过程的描述，B+树的概念，特别要注意B树和B+树概念的对比，以及Hash表相关的概念。要熟练掌握顺序表、链表、二叉树上的查找方法，特别要注意顺序查找、二分查找的适用条件（比如链表上用二分查找就不合适）和算法复杂度。</p>
<p>六、排序。</p>
<p>既包括内部排序，又包括外部排序，排序既是重点，又是难点。</p>
<p>排序算法众多，光大纲上列出的内部排序就有9种，还要再加上外部排序，各种不同算法还有相应的一些概念定义需要记住。</p>
<p>选择题：</p>
<p>不同排序算法的复杂度，给定数列要求给出某种特定排序方法运行一轮后的排序结果，或者给出初始数列和一轮排序结果要求选择采用的排序算法，给定时间、空间复杂度要求以及数列特征要求选择合适的排序算法等等。</p>
<p>综合应用题：</p>
<p>与数组结合来考查。</p>
]]></content>
<summary type="html">
<p>一、线性表</p>
<p>链表插入、删除节点时的指针操作（选择题）；</p>
<p>双向链表等一些相对复杂的链表的操作（综合应用题）。</p>
<p>二、栈、队列和数组</p>
<p>1.栈与队列FILO和FIFO的特点。</p>
<p>针对栈FILO的特点，进栈出栈序列（
</summary>
<category term="学" scheme="https://feahter.github.io/categories/%E5%AD%A6/"/>
<category term="数据结构" scheme="https://feahter.github.io/tags/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84/"/>
<category term="考研" scheme="https://feahter.github.io/tags/%E8%80%83%E7%A0%94/"/>
</entry>
<entry>
<title>前端项目列表</title>
<link href="https://feahter.github.io/2017/05/11/%E5%89%8D%E7%AB%AF%E9%A1%B9%E7%9B%AE%E5%88%97%E8%A1%A8/"/>
<id>https://feahter.github.io/2017/05/11/前端项目列表/</id>
<published>2017-05-11T05:18:13.000Z</published>
<updated>2017-06-22T07:31:00.000Z</updated>
<content type="html"><![CDATA[<table>
<thead>
<tr>
<th style="text-align:center">项目名称</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/chuer_bzk/" target="_blank" rel="external">新初二暑假标准课</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/cryy_fz/" target="_blank" rel="external">成人英语项目页</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/wjky_fz/" target="_blank" rel="external">外教口语项目页</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/mdfz/" target="_blank" rel="external">民大附中招生专题页</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/kywyjh/" target="_blank" rel="external">考研无忧计划专题页</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/yskykg/" target="_blank" rel="external">雅思口语考官专题页</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/ynydy/" target="_blank" rel="external">优能一对一全日制课程</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/landingpage/yxxj/" target="_blank" rel="external">泡泡少儿幼小衔接着陆页</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/kydg/" target="_blank" rel="external">考研大纲专题</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/mnsyk/" target="_blank" rel="external">蒙纳士预科专题</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/landingpage/ppseyy/" target="_blank" rel="external">泡泡少儿英语培训</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/kjzf/" target="_blank" rel="external">空军招飞专题</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/ETS_TOEFL/" target="_blank" rel="external">托福项目页专题</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/vip1v6/" target="_blank" rel="external">北美VIP6人班专题</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/chunji/" target="_blank" rel="external">新东方春季班课程汇总页</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/xgncz" target="_blank" rel="external">初中新概念专题</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://new.bj.xdf.cn/heka/" target="_blank" rel="external">保定学校春节H5贺卡的制作</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/bdfyh5/" target="_blank" rel="external">保定学校方言测试H5页面</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/gre_xdf/" target="_blank" rel="external">新东方GRE专题</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/gmat_xdf/" target="_blank" rel="external">新东方GMAT专题</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/bzk_xm/" target="_blank" rel="external">一对一标准课专题</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/zhuanti/gangao_1v1/" target="_blank" rel="external">港澳英文面试课专题</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://new.bj.xdf.cn/zhongkao/" target="_blank" rel="external">中考网</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://qujingke.com" target="_blank" rel="external">取经课</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://hutuyu.cn" target="_blank" rel="external">糊涂鱼</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/sem/xyzmobile/" target="_blank" rel="external">小语种移动页</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/sem/sjbmobile/" target="_blank" rel="external">暑假班移动页</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/sem/jrtt_wdzs_red/" target="_blank" rel="external">今日头条外投1</a></td>
</tr>
<tr>
<td style="text-align:center"><a href="http://bj.xdf.cn/bj_static/sem/jrtt_wdzs_green/" target="_blank" rel="external">今日头条外投2</a></td>
</tr>
</tbody>
</table>
]]></content>
<summary type="html">
<table>
<thead>
<tr>
<th style="text-align:center">项目名称</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:center"><a href="http://bj.xd
</summary>
<category term="杂" scheme="https://feahter.github.io/categories/%E6%9D%82/"/>
<category term="项目列表" scheme="https://feahter.github.io/tags/%E9%A1%B9%E7%9B%AE%E5%88%97%E8%A1%A8/"/>
</entry>
<entry>
<title>关于webpack</title>
<link href="https://feahter.github.io/2017/02/18/%E5%85%B3%E4%BA%8Ewebpack/"/>
<id>https://feahter.github.io/2017/02/18/关于webpack/</id>
<published>2017-02-18T08:27:40.000Z</published>
<updated>2017-05-11T05:06:02.000Z</updated>
<content type="html"><![CDATA[<p>一、webpack入门准备：</p>
<p>本地装好<a href="https://nodejs.org/en/" target="_blank" rel="external">node</a>、<a href="https://www.npmjs.com/" target="_blank" rel="external">npm</a></p>
<p><strong>node</strong> v4.4.7</p>
<p><strong>npm</strong> v4.0.5</p>
<p>二、安装webpack：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">npm install -g webpack</div></pre></td></tr></table></figure>
<p><strong>webpack</strong> v2.4.1</p>
<p>三、构建项目：</p>
<p>1.创建项目文件webpack</p>
<p>2.命令行移动至webpack文件夹下</p>
<p>3.新建包管理文件package.json或命令行npm init默认创建</p>
<p>4.npm声明依赖覆盖package.json:</p>
<figure class="highlight json"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div><div class="line">16</div><div class="line">17</div><div class="line">18</div><div class="line">19</div><div class="line">20</div><div class="line">21</div><div class="line">22</div><div class="line">23</div><div class="line">24</div><div class="line">25</div><div class="line">26</div><div class="line">27</div><div class="line">28</div><div class="line">29</div></pre></td><td class="code"><pre><div class="line">{</div><div class="line"> <span class="attr">"devDependencies"</span>: {</div><div class="line"> <span class="attr">"babel-core"</span>: <span class="string">"^6.24.1"</span>,</div><div class="line"> <span class="attr">"babel-loader"</span>: <span class="string">"^7.0.0"</span>,</div><div class="line"> <span class="attr">"babel-preset-es2015"</span>: <span class="string">"^6.24.1"</span>,</div><div class="line"> <span class="attr">"css-loader"</span>: <span class="string">"^0.28.1"</span>,</div><div class="line"> <span class="attr">"extract-text-webpack-plugin"</span>: <span class="string">"^2.1.0"</span>,</div><div class="line"> <span class="attr">"file-loader"</span>: <span class="string">"^0.11.1"</span>,</div><div class="line"> <span class="attr">"html-webpack-plugin"</span>: <span class="string">"^2.28.0"</span>,</div><div class="line"> <span class="attr">"jquery"</span>: <span class="string">"^3.2.1"</span>,</div><div class="line"> <span class="attr">"lodash"</span>: <span class="string">"^4.17.4"</span>,</div><div class="line"> <span class="attr">"moment"</span>: <span class="string">"^2.18.1"</span>,</div><div class="line"> <span class="attr">"node-sass"</span>: <span class="string">"^4.5.2"</span>,</div><div class="line"> <span class="attr">"sass-loader"</span>: <span class="string">"^6.0.3"</span>,</div><div class="line"> <span class="attr">"scripts"</span>: <span class="string">"^0.1.0"</span>,</div><div class="line"> <span class="attr">"style-loader"</span>: <span class="string">"^0.17.0"</span>,</div><div class="line"> <span class="attr">"url-loader"</span>: <span class="string">"^0.5.8"</span>,</div><div class="line"> <span class="attr">"webpack"</span>: <span class="string">"^2.4.1"</span>,</div><div class="line"> <span class="attr">"webpack-dev-server"</span>: <span class="string">"^2.4.5"</span></div><div class="line"> },</div><div class="line"> <span class="attr">"dependencies"</span>: {</div><div class="line"> <span class="attr">"lodash"</span>: <span class="string">"^4.17.4"</span>,</div><div class="line"> <span class="attr">"moment"</span>: <span class="string">"^2.18.1"</span></div><div class="line"> },</div><div class="line"> <span class="attr">"scripts"</span>: {</div><div class="line"> <span class="attr">"start"</span>: <span class="string">"webpack-dev-server --inline"</span>,</div><div class="line"> <span class="attr">"build"</span>: <span class="string">"webpack --progress --profile --colors --config webpack.production.config.js"</span></div><div class="line"> }</div><div class="line">}</div></pre></td></tr></table></figure>
<p>直接</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">npm install</div></pre></td></tr></table></figure>
<p>安装依赖</p>
<p>5.新建webpack.config.js文件，这是webpack核心</p>
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div><div class="line">16</div><div class="line">17</div><div class="line">18</div><div class="line">19</div><div class="line">20</div><div class="line">21</div><div class="line">22</div><div class="line">23</div><div class="line">24</div><div class="line">25</div><div class="line">26</div><div class="line">27</div><div class="line">28</div><div class="line">29</div><div class="line">30</div><div class="line">31</div><div class="line">32</div><div class="line">33</div><div class="line">34</div><div class="line">35</div><div class="line">36</div><div class="line">37</div><div class="line">38</div><div class="line">39</div><div class="line">40</div><div class="line">41</div><div class="line">42</div><div class="line">43</div><div class="line">44</div><div class="line">45</div><div class="line">46</div><div class="line">47</div><div class="line">48</div><div class="line">49</div><div class="line">50</div><div class="line">51</div><div class="line">52</div><div class="line">53</div><div class="line">54</div><div class="line">55</div><div class="line">56</div><div class="line">57</div><div class="line">58</div><div class="line">59</div><div class="line">60</div></pre></td><td class="code"><pre><div class="line"><span class="comment">//声明对象</span></div><div class="line"><span class="keyword">var</span> webpack=<span class="built_in">require</span>(<span class="string">'webpack'</span>);</div><div class="line"><span class="keyword">var</span> path = <span class="built_in">require</span>(<span class="string">'path'</span>);</div><div class="line"><span class="keyword">var</span> HtmlwebpackPligin=<span class="built_in">require</span>(<span class="string">'html-webpack-plugin'</span>);</div><div class="line"><span class="keyword">var</span> ROOT_PATH=path.resolve(__dirname);</div><div class="line"><span class="keyword">var</span> APP_PATH=path.resolve(ROOT_PATH,<span class="string">'app/js'</span>);</div><div class="line"><span class="keyword">var</span> CSS_PATH=path.resolve(ROOT_PATH,<span class="string">'app/css'</span>);</div><div class="line"><span class="keyword">var</span> BUILD_PATH=path.resolve(ROOT_PATH,<span class="string">'build'</span>);</div><div class="line"><span class="built_in">module</span>.exports = {</div><div class="line"> <span class="comment">//入口</span></div><div class="line"> entry:{ </div><div class="line"> app:APP_PATH,</div><div class="line"> },</div><div class="line"> <span class="comment">//出口</span></div><div class="line"> output: {</div><div class="line"> path: BUILD_PATH,</div><div class="line"> filename: <span class="string">'bundle.js'</span>,</div><div class="line"> },</div><div class="line"> <span class="comment">//node虚拟服务</span></div><div class="line"> devServer: {</div><div class="line"> historyApiFallback: <span class="literal">true</span>,</div><div class="line"> inline: <span class="literal">true</span>,</div><div class="line"> },</div><div class="line"> <span class="comment">//loaders模块</span></div><div class="line"> <span class="built_in">module</span>:{</div><div class="line"> loaders:[</div><div class="line"> { </div><div class="line"> test: <span class="regexp">/\.scss$/</span>,</div><div class="line"> loaders:[<span class="string">'style-loader'</span>,<span class="string">'css-loader?sourceMap'</span>,<span class="string">'sass-loader?sourceMap'</span>],</div><div class="line"> include: CSS_PATH,</div><div class="line"> },</div><div class="line"> {</div><div class="line"> test: <span class="regexp">/\.(png|jpg|jpeg)$/</span>,</div><div class="line"> loader: <span class="string">'url-loader?limit=3000000'</span></div><div class="line"> },</div><div class="line"> {</div><div class="line"> test: <span class="regexp">/\.js$/</span>,</div><div class="line"> loader: <span class="string">'babel-loader'</span>,</div><div class="line"> include: APP_PATH,</div><div class="line"> query: {</div><div class="line"> presets: [<span class="string">'es2015'</span>]</div><div class="line"> }</div><div class="line"> },</div><div class="line"> ]</div><div class="line"> },</div><div class="line"> <span class="comment">//资源地图</span></div><div class="line"> devtool: <span class="string">'eval-source-map'</span>,</div><div class="line"> <span class="comment">//插件</span></div><div class="line"> plugins: [</div><div class="line"> <span class="keyword">new</span> HtmlwebpackPligin({</div><div class="line"> title:<span class="string">'Hello World app'</span></div><div class="line"> }),</div><div class="line"> <span class="keyword">new</span> webpack.ProvidePlugin({</div><div class="line"> $: <span class="string">"jquery"</span>,</div><div class="line"> jQuery: <span class="string">"jquery"</span>,</div><div class="line"> <span class="string">"window.jQuery"</span>: <span class="string">"jquery"</span></div><div class="line"> })</div><div class="line"> ],</div><div class="line"></div><div class="line">};</div></pre></td></tr></table></figure>
<p>6.开发生产环境分离</p>
<p>分别在根目录新建app和build文件夹做开发和生产环境。</p>
<p>在app内新建前端常规文件夹层级css、js、images等。</p>
<p>运行 <code>webpack -p</code>命令生成压缩文件bundle.js。</p>
<p>在build内新建index.html引入bundle.js。</p>
<figure class="highlight html"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div></pre></td><td class="code"><pre><div class="line"><span class="meta"><!DOCTYPE html></span></div><div class="line"><span class="tag"><<span class="name">html</span>></span></div><div class="line"> <span class="tag"><<span class="name">head</span>></span></div><div class="line"> <span class="tag"><<span class="name">meta</span> <span class="attr">charset</span>=<span class="string">"UTF-8"</span>></span></div><div class="line"> <span class="tag"><<span class="name">title</span>></span>Hello World app<span class="tag"></<span class="name">title</span>></span></div><div class="line"> <span class="tag"></<span class="name">head</span>></span></div><div class="line"> <span class="tag"><<span class="name">body</span>></span></div><div class="line"> <span class="tag"><<span class="name">script</span> <span class="attr">type</span>=<span class="string">"text/javascript"</span> <span class="attr">src</span>=<span class="string">"bundle.js"</span>></span><span class="undefined"></span><span class="tag"></<span class="name">script</span>></span><span class="tag"></<span class="name">body</span>></span></div><div class="line"><span class="tag"></<span class="name">html</span>></span></div></pre></td></tr></table></figure>
<p>本地即可直接打开index.html查看效果。</p>
<p>复制webpack.config.js文件并改名为webpack.production.config.js.</p>
<p>删掉devServer相关代码，资源打包分离压缩处理资源</p>
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div><div class="line">7</div><div class="line">8</div><div class="line">9</div><div class="line">10</div><div class="line">11</div><div class="line">12</div><div class="line">13</div><div class="line">14</div><div class="line">15</div><div class="line">16</div><div class="line">17</div><div class="line">18</div><div class="line">19</div><div class="line">20</div><div class="line">21</div><div class="line">22</div><div class="line">23</div><div class="line">24</div><div class="line">25</div><div class="line">26</div><div class="line">27</div><div class="line">28</div><div class="line">29</div><div class="line">30</div><div class="line">31</div><div class="line">32</div><div class="line">33</div><div class="line">34</div><div class="line">35</div><div class="line">36</div><div class="line">37</div><div class="line">38</div><div class="line">39</div><div class="line">40</div><div class="line">41</div><div class="line">42</div><div class="line">43</div><div class="line">44</div><div class="line">45</div><div class="line">46</div><div class="line">47</div><div class="line">48</div><div class="line">49</div><div class="line">50</div><div class="line">51</div><div class="line">52</div><div class="line">53</div><div class="line">54</div><div class="line">55</div><div class="line">56</div><div class="line">57</div><div class="line">58</div><div class="line">59</div><div class="line">60</div><div class="line">61</div></pre></td><td class="code"><pre><div class="line"><span class="comment">//声明对象</span></div><div class="line"><span class="keyword">var</span> webpack=<span class="built_in">require</span>(<span class="string">'webpack'</span>);</div><div class="line"><span class="keyword">var</span> path = <span class="built_in">require</span>(<span class="string">'path'</span>);</div><div class="line"><span class="keyword">var</span> HtmlwebpackPligin=<span class="built_in">require</span>(<span class="string">'html-webpack-plugin'</span>);</div><div class="line"><span class="keyword">var</span> ROOT_PATH=path.resolve(__dirname);</div><div class="line"><span class="keyword">var</span> APP_PATH=path.resolve(ROOT_PATH,<span class="string">'app/js'</span>);</div><div class="line"><span class="keyword">var</span> CSS_PATH=path.resolve(ROOT_PATH,<span class="string">'app/css'</span>);</div><div class="line"><span class="keyword">var</span> BUILD_PATH=path.resolve(ROOT_PATH,<span class="string">'build'</span>);</div><div class="line"><span class="built_in">module</span>.exports = {</div><div class="line"> <span class="comment">//入口</span></div><div class="line"> entry:{ </div><div class="line"> app: path.resolve(APP_PATH, <span class="string">'index.js'</span>),</div><div class="line"> <span class="comment">//添加要打包在vendors里面的库</span></div><div class="line"> vendors: [<span class="string">'jquery'</span>, <span class="string">'moment'</span>]</div><div class="line"> },</div><div class="line"> <span class="comment">//输出</span></div><div class="line"> output: {</div><div class="line"> path: BUILD_PATH,</div><div class="line"> filename: <span class="string">'bundle.js'</span>,</div><div class="line"> },</div><div class="line"> <span class="comment">//loaders模块打包、转译处理</span></div><div class="line"> <span class="built_in">module</span>:{</div><div class="line"> loaders:[</div><div class="line"> { </div><div class="line"> test: <span class="regexp">/\.scss$/</span>,</div><div class="line"> loaders:[<span class="string">'style-loader'</span>,<span class="string">'css-loader?sourceMap'</span>,<span class="string">'sass-loader?sourceMap'</span>],</div><div class="line"> include: CSS_PATH,</div><div class="line"> },</div><div class="line"> {</div><div class="line"> test: <span class="regexp">/\.(png|jpg|jpeg)$/</span>,</div><div class="line"> loader: <span class="string">'url-loader?limit=3000000'</span></div><div class="line"> },</div><div class="line"> {</div><div class="line"> test: <span class="regexp">/\.js$/</span>,</div><div class="line"> loader: <span class="string">'babel-loader'</span>,</div><div class="line"> include: APP_PATH,</div><div class="line"> query: {</div><div class="line"> presets: [<span class="string">'es2015'</span>]</div><div class="line"> }</div><div class="line"> },</div><div class="line"> ]</div><div class="line"> },</div><div class="line"> <span class="comment">//生成资源地图.map</span></div><div class="line"> devtool: <span class="string">'eval-source-map'</span>,</div><div class="line"> <span class="comment">//插件</span></div><div class="line"> plugins: [</div><div class="line"> <span class="comment">//这个使用uglifyJs压缩你的js代码</span></div><div class="line"> <span class="keyword">new</span> webpack.optimize.UglifyJsPlugin({minimize: <span class="literal">true</span>}),</div><div class="line"> <span class="comment">//把入口文件里面的数组打包成verdors.js</span></div><div class="line"> <span class="keyword">new</span> webpack.optimize.CommonsChunkPlugin(<span class="string">'vendors'</span>, <span class="string">'vendors.js'</span>),</div><div class="line"> <span class="keyword">new</span> HtmlwebpackPligin({</div><div class="line"> title:<span class="string">'Hello World app'</span></div><div class="line"> }),</div><div class="line"> <span class="keyword">new</span> webpack.ProvidePlugin({</div><div class="line"> $: <span class="string">"jquery"</span>,</div><div class="line"> jQuery: <span class="string">"jquery"</span>,</div><div class="line"> <span class="string">"window.jQuery"</span>: <span class="string">"jquery"</span></div><div class="line"> })</div><div class="line"> ],</div><div class="line"></div><div class="line">};</div></pre></td></tr></table></figure>
]]></content>
<summary type="html">
<p>一、webpack入门准备：</p>
<p>本地装好<a href="https://nodejs.org/en/" target="_blank" rel="external">node</a>、<a href="https://www.npmjs.com/" targe
</summary>
<category term="术" scheme="https://feahter.github.io/categories/%E6%9C%AF/"/>
<category term="webpack" scheme="https://feahter.github.io/tags/webpack/"/>
<category term="前端模块化" scheme="https://feahter.github.io/tags/%E5%89%8D%E7%AB%AF%E6%A8%A1%E5%9D%97%E5%8C%96/"/>
</entry>
<entry>
<title>关于TypeScript</title>
<link href="https://feahter.github.io/2016/12/22/%E5%85%B3%E4%BA%8ETypeScript/"/>
<id>https://feahter.github.io/2016/12/22/关于TypeScript/</id>
<published>2016-12-22T01:53:16.000Z</published>
<updated>2016-12-22T06:08:56.000Z</updated>
<content type="html"><![CDATA[<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》</a></p>
<h2 id="缘由"><a href="#缘由" class="headerlink" title="缘由"></a>缘由</h2><p>事情是这样的，我想搜索 <code>TypeScript 中文教程</code>，结果在 <a href="https://www.baidu.com/" target="_blank" rel="external">https://www.baidu.com</a> ， <a href="https://cn.bing.com/" target="_blank" rel="external">https://cn.bing.com</a> ，上都找不到官方的翻译，也没有一个像样的翻译（搜索的时间是2015-12-02），可怜我们无法使用google，所以就想去自己翻译官方的 TypeScript-Handbook。</p>
<p>于是我Fork了官方的库 <a href="https://github.com/Microsoft/TypeScript-Handbook" target="_blank" rel="external">https://github.com/Microsoft/TypeScript-Handbook</a> , 到我的库中<a href="https://github.com/MyErpSoft/TypeScript-Handbook" target="_blank" rel="external">https://github.com/MyErpSoft/TypeScript-Handbook</a> ,我当然不能直接修改他们的文件，于是我的做法建立子目录 zh-CHS (<a href="https://github.com/MyErpSoft/TypeScript-Handbook/tree/master/pages/zh-CHS" target="_blank" rel="external">https://github.com/MyErpSoft/TypeScript-Handbook/tree/master/pages/zh-CHS</a> )，梦想着哪天官方是不是 合并我的变更呢，哈哈，美美的做着白日梦。</p>
<p>可是在翻译不到几个小时之后呢，觉得不甘心，既然我放在github上，那是不是在 <a href="https://github.com/" target="_blank" rel="external">https://GitHub.com</a> 可以搜索到别人的翻译呢？大家都爱github吗，对吧？ 于是在github上搜 <code>TypeScript Handbook</code>，果然有，翻译的比较完整的有：</p>
<ul>
<li><a href="https://github.com/oyyd/typescript-handbook-zh" target="_blank" rel="external">https://github.com/oyyd/typescript-handbook-zh</a> 完整</li>
<li><a href="https://github.com/ntesmail/Typescript-Handbook" target="_blank" rel="external">https://github.com/ntesmail/Typescript-Handbook</a> 不完整</li>
<li><a href="https://github.com/xykbear/TypeScriptHandbook" target="_blank" rel="external">https://github.com/xykbear/TypeScriptHandbook</a> 比较完整</li>
</ul>
<p>既然大家都有翻译了，那我也不必重新造轮子了，正打算放弃，突然一想，那中国那么多想学习TypeScript的人，如果想入门岂不是和我遇到一样的经历，我至少知道Github，但很多初学者是不知道的，我要帮助后来者。</p>
<p>鉴于我的博客的影响力（羞），比如在百度上搜索： <code>typescript 入门</code>，我之前的文章是结果的第三个（2015-12-03测试），所以我有必要将这些翻译 Copy 到我的博客，然后整理一下发表到博客园主页，当然我会注明这不是我翻译的，注明出处，这样至少通过我的博客可以跳转到原始的翻译。于是我继续下去了。</p>
<h2 id="意外发现"><a href="#意外发现" class="headerlink" title="意外发现"></a>意外发现</h2><p>在翻译和整理的过程中，我发现在github上我找到的翻译版本有些旧，最完整的 oyyd 的翻译也是旧的，于是我在Copy的同时，也补充入最新的版本。在自己翻译的过程中，我发现了一处错误，于是我提交了一个 Issue ，<a href="https://github.com/Microsoft/TypeScript-Handbook/issues/118" target="_blank" rel="external">https://github.com/Microsoft/TypeScript-Handbook/issues/118</a> ，微软迅速得到修正，我也突然有了重大发现： 帮忙修订的有个人叫 zhongsp ，中国人，那一定有中文的翻译咯？ 果不其然，于是… … 当当当当 … … 当（音乐起）.</p>
<p>大家看 <a href="https://github.com/zhongsp/TypeScript" target="_blank" rel="external">https://github.com/zhongsp/TypeScript</a> 的就对了，这才是官方正统的中文翻译。</p>
<p>当然，为什么我之前一直找不到他呢？因为这货竟然将项目的名字叫 <code>TypeScript</code> ，找不到是应该的，而且他发表到<a href="https://zhongsp.gitbooks.io/typescript-handbook/content/" target="_blank" rel="external">https://zhongsp.gitbooks.io/typescript-handbook/content/</a> 这样的网站，中国哪里能搜索的到。于是，我毅然继续Copy,Copy… …然后发表到我的 <a href="http://tansm.cnblogs.com/" target="_blank" rel="external">http://tansm.cnblogs.com</a></p>
<h2 id="关于发表到首页"><a href="#关于发表到首页" class="headerlink" title="关于发表到首页"></a>关于发表到首页</h2><p>作为一个毫无原创内容的博客，发表到博客园的首页这件事情我知道是不对的，但是… …</p>
<p>为了中国千万万找不到合适 TypeScript 中文入门教程 的朋友，我冒着被迅速下架的危险，还是要发表上去，这样这些搜索引擎才能将这些转载的文章收录到靠前啊。</p>
<p>再说了，第一个章节大部分可是我翻译的啊，还是很原创的，所以不能完全算转载了。</p>
<p>同志们，留下你的只言片语，也能让排名靠前哦。 好吧… … 一个Copy者怎么这么理直气壮了 ，不说 了。</p>
<h2 id="目录"><a href="#目录" class="headerlink" title="目录"></a>目录</h2><p>虽然我是转载的，但看在Copy这么多文章也是很幸苦的好吧，我罗列一个目录。</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Decorators.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 17、注解</a> (2015-12-03 11:36)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Symbols.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 16、Symbols</a> (2015-12-03 11:35)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Iterators_and_Generators.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 15、可迭代性</a> (2015-12-03 11:33)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Writing_Definition_Files.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 14、输入.d.ts文件</a> (2015-12-03 11:31)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Type_Compatibility.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 13、类型兼容性</a> (2015-12-03 11:29)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Type_Inference.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 12、类型推导</a> (2015-12-03 11:28)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Declaration_Merging.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 11、声明合并</a> (2015-12-03 11:26)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Mixins.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 10、混入</a> (2015-12-03 11:24)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Generics.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 9、泛型</a> (2015-12-03 11:22)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Functions.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 8、函数</a> (2015-12-03 11:21)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Modules.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 7、模块</a> (2015-12-03 11:18)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Namespaces.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 6、命名空间</a> (2015-12-03 11:14)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Namespaces_and_Modules.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 5、命名空间和模块</a> (2015-12-03 11:11)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Classes.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 4、类</a> (2015-12-03 11:08)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Interfaces.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 3、接口</a> (2015-12-03 11:03)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_Enums.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》 2、枚举</a> (2015-12-03 10:58)</p>
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook_BasicTypes.html" target="_blank" rel="external">《TypeScript 中文入门教程》 1、基础数据类型</a> (2015-12-02 16:14)</p>
]]></content>
<summary type="html">
<p><a href="http://www.cnblogs.com/tansm/p/TypeScript_Handbook.html" target="_blank" rel="external">转载：《TypeScript 中文入门教程》</a></p>
<h2 id="缘
</summary>
<category term="术" scheme="https://feahter.github.io/categories/%E6%9C%AF/"/>
<category term="TypeScript" scheme="https://feahter.github.io/tags/TypeScript/"/>
</entry>
<entry>
<title>关于gulp</title>
<link href="https://feahter.github.io/2016/12/08/%E5%85%B3%E4%BA%8Egulp/"/>
<id>https://feahter.github.io/2016/12/08/关于gulp/</id>
<published>2016-12-08T02:56:31.000Z</published>
<updated>2016-12-08T05:03:38.000Z</updated>
<content type="html"><![CDATA[<h3 id="awesome-gulp中文版"><a href="#awesome-gulp中文版" class="headerlink" title="awesome-gulp中文版"></a><a href="https://github.com/alferov/awesome-gulp" target="_blank" rel="external">awesome-gulp</a>中文版</h3><blockquote>
<p><a href="https://github.com/gulpjs/gulp" target="_blank" rel="external">gulp</a>的资源，插件和使用实例清单， 致力于打造更好的前端工程构建流程。</p>
</blockquote>
<p><a href="https://github.com/sindresorhus/awesome" target="_blank" rel="external">awesome清单</a> </p>
<h2 id="资源"><a href="#资源" class="headerlink" title="资源"></a>资源</h2><h3 id="通用资源"><a href="#通用资源" class="headerlink" title="通用资源"></a>通用资源</h3><ul>
<li><a href="http://gulpjs.com/" target="_blank" rel="external">官网</a></li>
<li><a href="http://www.gulpjs.com.cn/" target="_blank" rel="external">中文网</a></li>
<li><a href="https://github.com/gulpjs/gulp" target="_blank" rel="external">Github库</a></li>
<li><a href="http://gulpjs.com/plugins/" target="_blank" rel="external">插件注册</a></li>
<li><a href="https://www.npmjs.com/package/gulp" target="_blank" rel="external">NPM模块</a></li>
<li><a href="https://github.com/gulpjs/plugins/blob/master/src/blackList.json" target="_blank" rel="external">插件黑名单</a></li>
</ul>
<h3 id="官方文档"><a href="#官方文档" class="headerlink" title="官方文档"></a>官方文档</h3><ul>
<li><a href="https://github.com/gulpjs/gulp/blob/master/docs/getting-started.md" target="_blank" rel="external">快速开始</a></li>
<li><a href="https://github.com/gulpjs/gulp/blob/master/docs/API.md" target="_blank" rel="external">API文档</a></li>
<li><a href="https://github.com/gulpjs/gulp/tree/master/docs#articles" target="_blank" rel="external">CLI 文档</a></li>
<li><a href="https://github.com/gulpjs/gulp/blob/master/docs/writing-a-plugin/README.md" target="_blank" rel="external">开始写一个插件</a></li>
<li><a href="https://github.com/gulpjs/gulp/tree/master/docs/recipes" target="_blank" rel="external">使用诀窍</a></li>
</ul>
<h3 id="组织"><a href="#组织" class="headerlink" title="组织"></a>组织</h3><ul>
<li><a href="http://stackoverflow.com/questions/tagged/gulp" target="_blank" rel="external">StackOverflow</a></li>
<li><a href="https://twitter.com/gulpjs" target="_blank" rel="external">Twitter</a></li>
</ul>
<h3 id="入门教程"><a href="#入门教程" class="headerlink" title="入门教程"></a>入门教程</h3><h4 id="Gulp入门"><a href="#Gulp入门" class="headerlink" title="Gulp入门"></a>Gulp入门</h4><ul>
<li><a href="https://www.smashingmagazine.com/2014/06/building-with-gulp/" target="_blank" rel="external">使用Gulp构建前端工程</a></li>
<li><a href="https://scotch.io/tutorials/automate-your-tasks-easily-with-gulp-js" target="_blank" rel="external">通过Gulp.js轻松自动化构建你的前端工程</a></li>
<li><a href="https://medium.com/@contrahacks/gulp-3828e8126466" target="_blank" rel="external">Gulp，让前端工程可视化</a></li>
<li><a href="http://stefanimhoff.de/tag/gulp/" target="_blank" rel="external">Gulp.js是什么？</a></li>
<li><a href="http://blog.johnnyreilly.com/2015/02/using-gulp-in-asp-net-instead-of-web-optimization.html" target="_blank" rel="external">使用Gulp在你的HTML中直接插入Scripts和Styles标签</a></li>
<li><a href="http://denbuzze.com/post/5-lessons-learned-using-gulpjs/" target="_blank" rel="external">5节课学会使用Gulp.js</a></li>
<li><a href="http://lab.brightnorth.co.uk/2014/08/13/automating-linkage-how-i-learned-to-stop-worrying-and-love-the-build/" target="_blank" rel="external">我是怎样摆脱前端工程的困扰的？</a></li>
<li><a href="https://www.codementor.io/development-process/tutorial/how-to-set-up-gulp-beginner-guide#/" target="_blank" rel="external">第一次开始Gulp Task</a></li>
<li><a href="http://blog.overzealous.com/post/74121048393/why-you-shouldnt-create-a-gulp-plugin-or-how-to" target="_blank" rel="external">为什么你不自己写一个Gulp插件？</a></li>
<li><a href="http://blog.rangle.io/angular-gulp-bestpractices/" target="_blank" rel="external">6个最好的从根本改善你的开发经验的Gulp实战练习</a></li>
<li><a href="https://css-tricks.com/gulp-for-beginners/" target="_blank" rel="external">Gulp初学者教程</a></li>
</ul>
<h4 id="Gulp-4-入门"><a href="#Gulp-4-入门" class="headerlink" title="Gulp 4 入门"></a>Gulp 4 入门</h4><ul>
<li><a href="https://blog.wearewizards.io/migrating-to-gulp-4-by-example" target="_blank" rel="external">迁移到Gulp 4的例子</a></li>
<li><a href="http://fettblog.eu/gulp-4-parallel-and-series/" target="_blank" rel="external">Gulp 4: 新的task执行系统 - gulp.parallel 和 gulp.series</a></li>
</ul>
<h4 id="Gulp-with-Browserify"><a href="#Gulp-with-Browserify" class="headerlink" title="Gulp with Browserify"></a>Gulp with Browserify</h4><ul>
<li><a href="https://medium.com/@sogko/gulp-browserify-the-gulp-y-way-bb359b3f9623" target="_blank" rel="external">Gulp + Browserify, the Gulp-y Way</a></li>
<li><a href="https://viget.com/extend/gulp-browserify-starter-faq" target="_blank" rel="external">Gulp + Browserify</a></li>
<li><a href="https://github.com/gulpjs/gulp/blob/master/docs/recipes/fast-browserify-builds-with-watchify.md" target="_blank" rel="external">快速构建Browserify和Watchify</a></li>
</ul>
<h4 id="Gulp-with-Angular"><a href="#Gulp-with-Angular" class="headerlink" title="Gulp with Angular"></a>Gulp with Angular</h4><ul>
<li><a href="http://blog.jhades.org/what-every-angular-project-likely-needs-and-a-gulp-build-to-provide-it/" target="_blank" rel="external">Angular工程需要什么 - Gulp能提供什么</a></li>
</ul>
<h4 id="Gulp-with-Angular-and-Browserify"><a href="#Gulp-with-Angular-and-Browserify" class="headerlink" title="Gulp with Angular and Browserify"></a>Gulp with Angular and Browserify</h4><ul>
<li><a href="http://omarfouad.com/blog/2015/03/21/advanced-angularjs-structure-with-gulp-node-and-browserify/" target="_blank" rel="external">使用 Gulp, Node and Browserify构建先进的 AngularJS工程结构</a></li>
</ul>
<h4 id="Gulp-with-React-and-Browserify"><a href="#Gulp-with-React-and-Browserify" class="headerlink" title="Gulp with React and Browserify"></a>Gulp with React and Browserify</h4><ul>
<li><a href="https://hacks.mozilla.org/2014/08/browserify-and-gulp-with-react/" target="_blank" rel="external">Browserify、Gulp 和 React</a></li>
<li><a href="http://pomax.github.io/1420592591221/taking-react-to-the-next-level-mixins-gulp-and-browserify" target="_blank" rel="external">Taking React to the Next Level: Mixins, Gulp, and Browserify</a></li>
</ul>
<h4 id="Gulp-with-Ember"><a href="#Gulp-with-Ember" class="headerlink" title="Gulp with Ember"></a>Gulp with Ember</h4><ul>
<li><a href="http://www.sitepoint.com/improving-ember-js-workflow-using-gulp-js/" target="_blank" rel="external">使用Gulp.js改进你的Ember.js工作流</a></li>
</ul>
<h3 id="其他资源"><a href="#其他资源" class="headerlink" title="其他资源"></a>其他资源</h3><ul>
<li><a href="https://github.com/osscafe/gulp-cheatsheet" target="_blank" rel="external">Gulp 备忘录</a></li>
<li><a href="https://github.com/johnpapa/gulp-patterns" target="_blank" rel="external">Gulp清单</a></li>
</ul>
<h2 id="插件"><a href="#插件" class="headerlink" title="插件"></a>插件</h2><h3 id="编译"><a href="#编译" class="headerlink" title="编译"></a>编译</h3><ul>
<li><a href="https://github.com/dlmanning/gulp-sass" target="_blank" rel="external">gulp-sass</a> - 通过 <a href="https://github.com/sass/libsass" target="_blank" rel="external">libsass</a>将Sass编译成 CSS</li>
<li><a href="https://github.com/sindresorhus/gulp-ruby-sass" target="_blank" rel="external">gulp-ruby-sass</a> - 通过 Ruby Sass将Sass编译成CSS</li>
<li><a href="https://github.com/appleboy/gulp-compass" target="_blank" rel="external">gulp-compass</a> - 通过 Ruby Sass和CompassSass编译成CSS</li>
<li><a href="https://github.com/plus3network/gulp-less" target="_blank" rel="external">gulp-less</a> - <a href="https://github.com/less/less.js" target="_blank" rel="external">Less</a>编译成 CSS.</li>
<li><a href="https://github.com/stevelacy/gulp-stylus" target="_blank" rel="external">gulp-stylus</a> - <a href="https://github.com/stylus/stylus" target="_blank" rel="external">Stylus</a> 编译成 CSS.</li>
<li><a href="https://github.com/postcss/gulp-postcss" target="_blank" rel="external">gulp-postcss</a> - Pipe CSS 通过 <a href="https://github.com/postcss/postcss" target="_blank" rel="external">PostCSS</a> processors with a single parse.</li>
<li><a href="https://github.com/contra/gulp-coffee" target="_blank" rel="external">gulp-coffee</a> - <a href="https://github.com/jashkenas/coffeescript" target="_blank" rel="external">Coffeescript</a> 编译成 JavaScript.</li>
<li><a href="https://github.com/ivogabe/gulp-typescript" target="_blank" rel="external">gulp-typescript</a> - <a href="https://github.com/Microsoft/TypeScript" target="_blank" rel="external">TypeScript</a>编译成JavaScript.</li>
<li><a href="https://github.com/sindresorhus/gulp-react" target="_blank" rel="external">gulp-react</a> - Facebook <a href="https://github.com/facebook/react" target="_blank" rel="external">React</a> JSX 模板编译成JavaScript.</li>
<li><a href="https://github.com/shama/webpack-stream" target="_blank" rel="external">webpack-stream</a> - 将<a href="https://github.com/webpack/webpack" target="_blank" rel="external">webpack</a>集成在Gulp中使用。</li>
<li><a href="https://github.com/babel/gulp-babel" target="_blank" rel="external">gulp-babel</a> - ES6编译成ES5 通过 <a href="https://github.com/babel/babel" target="_blank" rel="external">babel</a>.</li>
<li><a href="https://github.com/sindresorhus/gulp-traceur" target="_blank" rel="external">gulp-traceur</a> - ES6编译成ES5 通过 <a href="https://github.com/google/traceur-compiler" target="_blank" rel="external">Traceur</a>.</li>
<li><a href="https://github.com/sindresorhus/gulp-regenerator" target="_blank" rel="external">gulp-regenerator</a> - ES6编译成ES5 通过 <a href="https://github.com/facebook/regenerator" target="_blank" rel="external">Regenerator</a>.</li>
<li><a href="https://github.com/sindresorhus/gulp-es6-transpiler" target="_blank" rel="external">gulp-es6-transpiler</a> - [过时的] ES6编译成ES5 通过 <a href="https://github.com/termi/es6-transpiler" target="_blank" rel="external">es6-transpiler</a>.</li>
<li><a href="https://github.com/sindresorhus/gulp-myth" target="_blank" rel="external">gulp-myth</a> - <a href="https://github.com/segmentio/myth" target="_blank" rel="external">Myth</a> - a polyfill for future versions of the CSS spec.</li>
<li><a href="https://github.com/MoOx/gulp-cssnext" target="_blank" rel="external">gulp-cssnext</a> - [过时的] 使用下一代的 CSS 规范通过 <a href="https://github.com/MoOx/postcss-cssnext" target="_blank" rel="external">cssnext</a>.</li>
</ul>
<h3 id="合并"><a href="#合并" class="headerlink" title="合并"></a>合并</h3><ul>
<li><a href="https://github.com/contra/gulp-concat" target="_blank" rel="external">gulp-concat</a> - 合并文件.</li>
</ul>
<h3 id="压缩"><a href="#压缩" class="headerlink" title="压缩"></a>压缩</h3><ul>
<li><a href="https://github.com/scniro/gulp-clean-css" target="_blank" rel="external">gulp-clean-css</a> - 压缩 CSS 通过 <a href="https://github.com/jakubpawlowicz/clean-css" target="_blank" rel="external">clean-css</a>.</li>
<li><a href="https://github.com/ben-eb/gulp-csso" target="_blank" rel="external">gulp-csso</a> - 压缩 CSS 通过 <a href="https://github.com/css/csso" target="_blank" rel="external">CSSO</a>.</li>
<li><a href="https://github.com/terinjokes/gulp-uglify" target="_blank" rel="external">gulp-uglify</a> - 压缩 JavaScript 通过 <a href="https://github.com/mishoo/UglifyJS2" target="_blank" rel="external">UglifyJS2</a>.</li>
<li><a href="https://github.com/jonschlinkert/gulp-htmlmin" target="_blank" rel="external">gulp-htmlmin</a> - 压缩 HTML 通过 <a href="https://github.com/kangax/html-minifier" target="_blank" rel="external">html-minifier</a>.</li>
<li><a href="https://github.com/murphydanger/gulp-minify-html" target="_blank" rel="external">gulp-minify-html</a> - 压缩 HTML 通过 <a href="https://github.com/Swaagie/minimize" target="_blank" rel="external">Minimize</a>.</li>
<li><a href="https://github.com/sindresorhus/gulp-imagemin" target="_blank" rel="external">gulp-imagemin</a> - 压缩 PNG, JPEG, GIF and SVG 图片 通过 <a href="https://github.com/imagemin/imagemin" target="_blank" rel="external">imagemin</a>.</li>
<li><a href="https://github.com/ben-eb/gulp-svgmin" target="_blank" rel="external">gulp-svgmin</a> - 通过Gulp压缩 SVG 文件</li>
</ul>
<h3 id="优化"><a href="#优化" class="headerlink" title="优化"></a>优化</h3><ul>
<li><a href="https://github.com/ben-eb/gulp-uncss" target="_blank" rel="external">gulp-uncss</a> - 移除未使用的CSS选择器通过 <a href="https://github.com/giakki/uncss" target="_blank" rel="external">UnCSS</a>.</li>
<li><a href="https://github.com/zckrs/gulp-css-base64" target="_blank" rel="external">gulp-css-base64</a> - 将CSS文件中所有的资源(有url()声明的)变成base64-encoded 数据的URI字符串</li>
<li><a href="https://github.com/akoenig/gulp-svg2png" target="_blank" rel="external">gulp-svg2png</a> - 将SVGs转换成PNGs</li>
<li><a href="https://github.com/mahnunchik/gulp-responsive" target="_blank" rel="external">gulp-responsive</a> - 生成不同尺寸的图片</li>
<li><a href="https://github.com/w0rm/gulp-svgstore" target="_blank" rel="external">gulp-svgstore</a> -将svg files 合并成一个通过 元素</li>
<li><a href="https://github.com/nfroidure/gulp-iconfont" target="_blank" rel="external">gulp-iconfont</a> - 通过SVG icons创建 icon fonts</li>
</ul>
<h3 id="资源注入"><a href="#资源注入" class="headerlink" title="资源注入"></a>资源注入</h3><ul>
<li><a href="https://github.com/jonkemp/gulp-useref" target="_blank" rel="external">gulp-useref</a> - 解析HTML文件中特殊标签里面的script或style标签，合并成一个script或css文件，并替换。</li>
<li><a href="https://github.com/klei/gulp-inject" target="_blank" rel="external">gulp-inject</a> - 将指定的css或js文件以标签的形式插入到HTML中的指定标志内。</li>
<li><a href="https://github.com/taptapship/wiredep" target="_blank" rel="external">wiredep</a> - 将Bower依赖自动注入HTML文件中。</li>
</ul>
<h3 id="模板"><a href="#模板" class="headerlink" title="模板"></a>模板</h3><ul>
<li><a href="https://github.com/miickel/gulp-angular-templatecache" target="_blank" rel="external">gulp-angular-templatecache</a> - 在$templateCache中联系并注册AngularJS模板</li>
<li><a href="https://github.com/phated/gulp-jade" target="_blank" rel="external">gulp-jade</a> - <a href="https://github.com/pugjs/jade" target="_blank" rel="external">Jade</a> 转换成 HTML.</li>
<li><a href="https://github.com/lazd/gulp-handlebars" target="_blank" rel="external">gulp-handlebars</a> - <a href="https://github.com/wycats/handlebars.js" target="_blank" rel="external">Handlebars</a>模板转换成 JavaScript.</li>
<li><a href="https://github.com/shannonmoeller/gulp-hb" target="_blank" rel="external">gulp-hb</a> - <a href="https://github.com/wycats/handlebars.js" target="_blank" rel="external">Handlebars</a> 模板转换成 HTML.</li>
<li><a href="https://github.com/sindresorhus/gulp-nunjucks" target="_blank" rel="external">gulp-nunjucks</a> - <a href="https://github.com/mozilla/nunjucks" target="_blank" rel="external">Nunjucks</a>模板转换成JavaScript.</li>
<li><a href="https://github.com/sindresorhus/gulp-dust" target="_blank" rel="external">gulp-dustjs</a> - <a href="https://github.com/linkedin/dustjs" target="_blank" rel="external">Dust</a>模板转换成JavaScript.</li>
<li><a href="https://github.com/e-jigsaw/gulp-riot" target="_blank" rel="external">gulp-riot</a> - <a href="https://github.com/riot/riot" target="_blank" rel="external">Riot</a>模板转换成JavaScript.</li>
<li><a href="https://github.com/sindresorhus/gulp-markdown" target="_blank" rel="external">gulp-markdown</a> - Markdown → HTML.</li>
<li><a href="https://github.com/sindresorhus/gulp-template" target="_blank" rel="external">gulp-template</a> - <a href="https://github.com/lodash/lodash" target="_blank" rel="external">Lodash </a>模板转换成JavaScript.</li>
<li><a href="https://github.com/colynb/gulp-swig" target="_blank" rel="external">gulp-swig</a> - <a href="https://github.com/paularmstrong/swig" target="_blank" rel="external">Swig</a>模板转换成HTML.</li>
<li><a href="https://github.com/denysdovhan/gulp-remark" target="_blank" rel="external">gulp-remark</a> - Gulp plugin for [remark]的Gulp插件(<a href="https://github.com/wooorm/remark" target="_blank" rel="external">https://github.com/wooorm/remark</a>) 通过插件处理markdown</li>
</ul>
<h3 id="代码校验"><a href="#代码校验" class="headerlink" title="代码校验"></a>代码校验</h3><ul>
<li><a href="https://www.npmjs.com/package/gulp-csslint" target="_blank" rel="external">gulp-csslint</a> - 通过<a href="https://github.com/CSSLint/csslint" target="_blank" rel="external">CSSLint</a>自动校验CSS.</li>
<li><a href="https://github.com/bezoerb/gulp-htmlhint" target="_blank" rel="external">gulp-htmlhint</a> - 通过<a href="https://github.com/yaniswang/HTMLHint" target="_blank" rel="external">HTMLHint</a>校验HTML.</li>
<li><a href="https://github.com/spalger/gulp-jshint" target="_blank" rel="external">gulp-jshint</a> - 通过<a href="https://github.com/jshint/jshint" target="_blank" rel="external">JSHint</a>发现错误和潜在的问题.</li>
<li><a href="https://github.com/jscs-dev/gulp-jscs" target="_blank" rel="external">gulp-jscs</a> - 通过<a href="https://github.com/jscs-dev/node-jscs" target="_blank" rel="external">jscs</a>检查JavaScript代码风格.</li>
<li><a href="https://github.com/janraasch/gulp-coffeelint" target="_blank" rel="external">gulp-coffeelint</a> - 一种用来保证<a href="https://github.com/jashkenas/coffeescript" target="_blank" rel="external">CoffeeScript</a>代码风格统一的检查。</li>
<li><a href="https://github.com/panuhorsmalahti/gulp-tslint" target="_blank" rel="external">gulp-tslint</a> - gulp的<a href="https://github.com/Microsoft/TypeScript" target="_blank" rel="external">TypeScript</a>代码校验插件.</li>
<li><a href="https://github.com/adametry/gulp-eslint" target="_blank" rel="external">gulp-eslint</a> - ECMAScript/JavaScript代码校验.</li>
<li><a href="https://github.com/callumacrae/gulp-w3cjs" target="_blank" rel="external">gulp-w3cjs</a> - 通过<a href="https://github.com/thomasdavis/w3cjs" target="_blank" rel="external">w3cjs</a>检验HTML.</li>
<li><a href="https://github.com/lesshint/gulp-lesshint" target="_blank" rel="external">gulp-lesshint</a> - 通过<a href="https://github.com/lesshint/lesshint" target="_blank" rel="external">lesshint</a>校验LESS.</li>
</ul>
<h3 id="实时加载"><a href="#实时加载" class="headerlink" title="实时加载"></a>实时加载</h3><ul>
<li><a href="https://github.com/BrowserSync/browser-sync" target="_blank" rel="external">browser-sync</a> - 保证多个浏览器或设备网页同步显示 (<a href="https://github.com/BrowserSync/gulp-browser-sync" target="_blank" rel="external">recipes</a>).</li>
<li><a href="https://github.com/vohof/gulp-livereload" target="_blank" rel="external">gulp-livereload</a> - Gulp的实时加载插件.</li>
</ul>
<h3 id="缓存"><a href="#缓存" class="headerlink" title="缓存"></a>缓存</h3><ul>
<li><a href="https://github.com/sindresorhus/gulp-changed" target="_blank" rel="external">gulp-changed</a> - 仅让发生改变的文件通过.</li>
<li><a href="https://github.com/contra/gulp-cached" target="_blank" rel="external">gulp-cached</a> - 一个简单的文件内存缓存.</li>
<li><a href="https://github.com/ahaurw01/gulp-remember" target="_blank" rel="external">gulp-remember</a> - 记忆并回收通过了的文件.</li>
<li><a href="https://github.com/tschaub/gulp-newer" target="_blank" rel="external">gulp-newer</a> - 只让新的源码通过.</li>
</ul>
<h3 id="流控制"><a href="#流控制" class="headerlink" title="流控制"></a>流控制</h3><ul>
<li><a href="https://github.com/grncdr/merge-stream" target="_blank" rel="external">merge-stream</a> - 合并多个流到一个插入的流.</li>
<li><a href="https://github.com/nfroidure/StreamQueue" target="_blank" rel="external">streamqueue</a> - 逐渐输入队列的流.</li>
<li><a href="https://github.com/OverZealous/run-sequence" target="_blank" rel="external">run-sequence</a> - 按要求运行一些依赖的Gulptask.</li>
<li><a href="https://github.com/robrich/gulp-if" target="_blank" rel="external">gulp-if</a> - 按照条件运行task.</li>
</ul>
<h3 id="日志"><a href="#日志" class="headerlink" title="日志"></a>日志</h3><ul>
<li><a href="https://github.com/mikaelbr/gulp-notify" target="_blank" rel="external">gulp-notify</a> - Gulp的通知插件.</li>
<li><a href="https://github.com/sindresorhus/gulp-size" target="_blank" rel="external">gulp-size</a> - 显示你的项目的大小.</li>
<li><a href="https://github.com/sindresorhus/gulp-debug" target="_blank" rel="external">gulp-debug</a> - 通过调试文件流来观察那些文件通过了你的Gulp管道.</li>
</ul>
<h3 id="测试"><a href="#测试" class="headerlink" title="测试"></a>测试</h3><ul>
<li><a href="https://github.com/sindresorhus/gulp-mocha" target="_blank" rel="external">gulp-mocha</a> - 运行<a href="https://github.com/mochajs/mocha" target="_blank" rel="external">Mocha</a>测试用例.</li>
<li><a href="https://github.com/sindresorhus/gulp-jasmine" target="_blank" rel="external">gulp-jasmine</a> - 在Node.js中运行<a href="https://github.com/jasmine/jasmine" target="_blank" rel="external">Jasmine 2</a> 测试用例.</li>
<li><a href="https://github.com/mllrsohn/gulp-protractor" target="_blank" rel="external">gulp-protractor</a> - 为<a href="https://github.com/angular/protractor" target="_blank" rel="external">Protractor</a>测试用例包裹Gulp.</li>
<li><a href="https://github.com/dylanb/gulp-coverage" target="_blank" rel="external">gulp-coverage</a> - 为Node.js覆盖相对于运行的测试运行独立的报告.</li>
<li><a href="https://github.com/karma-runner/gulp-karma" target="_blank" rel="external">gulp-karma</a> - 通过Gulp运行Karma测试用例.</li>
<li><a href="https://github.com/sindresorhus/gulp-ava" target="_blank" rel="external">gulp-ava</a>- 通过Gulp运行<a href="https://github.com/sindresorhus/ava" target="_blank" rel="external">AVA</a> 测试用例.</li>
</ul>
<h3 id="其他插件"><a href="#其他插件" class="headerlink" title="其他插件"></a>其他插件</h3><ul>
<li><a href="https://github.com/gulpjs/gulp-util" target="_blank" rel="external">gulp-util</a> - 包含一系列有用插件.</li>
<li><a href="https://github.com/floatdrop/gulp-plumber" target="_blank" rel="external">gulp-plumber</a> - 防止错误引起管道中断Prevent pipe breaking caused by errors.</li>
<li><a href="https://github.com/jackfranklin/gulp-load-plugins" target="_blank" rel="external">gulp-load-plugins</a> - 自动加载Gulp插件.</li>
<li><a href="https://github.com/ck86/main-bower-files" target="_blank" rel="external">main-bower-files</a> - 构建时自动获取bower库的文件.</li>
<li><a href="https://github.com/postcss/autoprefixer" target="_blank" rel="external">autoprefixer</a> - 解析CSS且根据规则添加浏览器兼容性前缀.</li>
<li><a href="https://github.com/floridoo/gulp-sourcemaps" target="_blank" rel="external">gulp-sourcemaps</a> - 提供source map支持.</li>
<li><a href="https://github.com/lazd/gulp-replace" target="_blank" rel="external">gulp-replace</a> - Gulp的一个字符串替换插件.</li>
<li><a href="https://github.com/hparra/gulp-rename" target="_blank" rel="external">gulp-rename</a> - 轻松重命名文件.</li>
<li><a href="https://github.com/sindresorhus/gulp-rev" target="_blank" rel="external">gulp-rev</a> - 在静态文件名的后面添加hash值，如: unicorn.css → unicorn-d41d8cd98f.css.</li>
<li><a href="https://github.com/sindresorhus/del" target="_blank" rel="external">del</a> - 使用globs删除文件/文件夹.</li>
<li><a href="https://github.com/robrich/gulp-exec" target="_blank" rel="external">gulp-exec</a> - 运行一个shell命令.</li>
<li><a href="https://github.com/sindresorhus/gulp-strip-debug" target="_blank" rel="external">gulp-strip-debug</a> - 除去javascript代码中的console,alert,debugger声明.</li>
<li><a href="https://github.com/unlight/gulp-cssimport" target="_blank" rel="external">gulp-cssimport</a> - 解析CSS文件，找到imports,将连接文件替换成imort声明.</li>
<li><a href="https://github.com/jonkemp/gulp-inline-css" target="_blank" rel="external">gulp-inline-css</a> - 将HTML中的css属性放到style标签中.</li>
<li><a href="https://github.com/shinnn/gulp-gh-pages" target="_blank" rel="external">gulp-gh-pages</a> - 将内容发布到GiHub有页面.</li>
<li><a href="https://github.com/Kagami/gulp-ng-annotate" target="_blank" rel="external">gulp-ng-annotate</a> - 通过<a href="https://github.com/olov/ng-annotate" target="_blank" rel="external">ng-annotate</a>添加Angular依赖注入.</li>
<li><a href="https://github.com/stevelacy/gulp-bump" target="_blank" rel="external">gulp-bump</a> - 通过Gulp Bump任何semvar JSON版本.</li>
<li><a href="https://github.com/coderhaoxin/gulp-file-include" target="_blank" rel="external">gulp-file-include</a> - 通过Gulp Include文件.</li>
<li><a href="https://github.com/sindresorhus/gulp-zip" target="_blank" rel="external">gulp-zip</a> - 以ZIP格式压缩文件.</li>
<li><a href="https://github.com/stevelacy/gulp-git" target="_blank" rel="external">gulp-git</a> - 通过Gulp运行git命令.</li>
<li><a href="https://github.com/sindresorhus/gulp-filter" target="_blank" rel="external">gulp-filter</a> - 使用globbing过滤文件.</li>
<li><a href="https://github.com/jas/gulp-preprocess" target="_blank" rel="external">gulp-preprocess</a> - 基于自定义内容或环境配置预处理文件.</li>
</ul>
<h2 id="脚手架"><a href="#脚手架" class="headerlink" title="脚手架"></a>脚手架</h2><h3 id="模板-1"><a href="#模板-1" class="headerlink" title="模板"></a>模板</h3><ul>
<li><a href="https://github.com/google/web-starter-kit" target="_blank" rel="external">web-starter-kit</a> - Google的Web Starter Kit.</li>
<li><a href="https://github.com/sindresorhus/gulp-plugin-boilerplate" target="_blank" rel="external">gulp-plugin-boilerplate</a> - 创建Gulp插件的开始模板.</li>
<li><a href="https://github.com/polymerelements/polymer-starter-kit" target="_blank" rel="external">polymer-starter-kit</a> -Polymer 1.0 应用的起点.</li>
<li><a href="https://github.com/este/este" target="_blank" rel="external">este</a> - 同构的web应用最全面的React/Flux开发栈和开始模板.</li>
<li><a href="https://github.com/mrmrs/mnml" target="_blank" rel="external">mnml</a> - 开发响应式HTML5/Sass项目的最小开始模板.</li>
<li><a href="https://github.com/cferdinandi/kraken" target="_blank" rel="external">kraken</a> 一个轻量级的、移动端优先的前端开发开始模板.</li>
<li><a href="https://github.com/jakemmarsh/angularjs-gulp-browserify-boilerplate" target="_blank" rel="external">angularjs-gulp-browserify-boilerplate</a> - 一个使用AngularJS, Sass, gulp, 和 Browserify技术的开始模板.</li>
<li><a href="https://github.com/poeticninja/hapi-ninja" target="_blank" rel="external">hapi-ninja</a> - 一个使用Node.js, Hapi, and Swig技术的开始模板.</li>
<li><a href="https://github.com/rappasoft/laravel-5-boilerplate" target="_blank" rel="external">laravel-5-boilerplate</a> - 一个Laravel 5 开始模板.</li>
<li><a href="https://github.com/wbkd/react-starterkit" target="_blank" rel="external">react-starterkit</a> - 包含react-router, Reflux, jest, webpack, gulp and Stylus的React开始模板.</li>
</ul>
<h3 id="Yeoman生成器"><a href="#Yeoman生成器" class="headerlink" title="Yeoman生成器"></a>Yeoman生成器</h3><ul>
<li><a href="https://github.com/yeoman/generator-gulp-webapp" target="_blank" rel="external">generator-gulp-webapp</a> - A 一个流行的web应用的gulp生成器.</li>
<li><a href="https://github.com/Swiip/generator-gulp-angular" target="_blank" rel="external">generator-gulp-angular</a> - 使用Gulp的AngularJS 的Yeoman生成器.</li>
<li><a href="https://github.com/randylien/generator-react-gulp-browserify" target="_blank" rel="external">generator-react-gulp-browserify</a> - 一个React库的Yeoman生成器，包含gulp, Browserify, Browsersync and Bootstrap.</li>
<li><a href="https://github.com/youngmountain/generator-node-gulp" target="_blank" rel="external">generator-node-gulp</a> - 一个Node.js模块生成器，包含gulp和 Mocha.</li>
<li><a href="https://github.com/niallobrien/generator-gulp-bootstrap" target="_blank" rel="external">generator-gulp-bootstrap</a> - 一个包含Bootstrap, gulp 和libsass的Yeoman生成器·.</li>
<li><a href="https://github.com/jgoux/generator-angulpify" target="_blank" rel="external">generator-angulpify</a> - 一个包含AngularJS, gulp和Browserify的Yeoman生成器.</li>
<li><a href="https://github.com/tmaximini/generator-ionic-gulp" target="_blank" rel="external">generator-ionic-gulp</a> - 一个Ionic工厂的Yeoman生成器.</li>
<li><a href="https://github.com/sindresorhus/generator-gulp-plugin-boilerplate" target="_blank" rel="external">generator-gulp-plugin-boilerplate</a> -一个输出 <a href="https://github.com/sindresorhus/gulp-plugin-boilerplate" target="_blank" rel="external">gulp plugin boilerplate</a>的脚手架.</li>
<li><a href="https://github.com/sondr3/generator-jekyllized" target="_blank" rel="external">generator-jekyllized</a> - 一个包含gulp, Sass, AutoPrefixer,资源优化，缓存等的Jekyll工作流.</li>
</ul>
<h2 id="其他"><a href="#其他" class="headerlink" title="其他"></a>其他</h2><ul>
<li><a href="https://github.com/laravel/elixir" target="_blank" rel="external">elixir</a> - 一个为你的应用定义基本的gulp任务的干净、灵活的API.</li>
<li><a href="https://github.com/sindresorhus/gulp-app" target="_blank" rel="external">gulp-app</a> - 将Gulp作为一个应用(OS X).</li>
<li><a href="https://github.com/Lostmyname/lmn-gulp-tasks" target="_blank" rel="external">lmn-gulp-tasks</a> - gulp任务的单元测试示例.</li>
<li><a href="http://gulp-cookery.github.io/gulp-chef/" target="_blank" rel="external">gulp-chef</a> - 一个优雅的、简单的重复使用gulp task的方法.</li>
</ul>
<p>本文出处：<a href="http://www.cnblogs.com/-ding/p/5972162.html" target="_blank" rel="external">http://www.cnblogs.com/-ding/p/5972162.html</a></p>
]]></content>
<summary type="html">
<h3 id="awesome-gulp中文版"><a href="#awesome-gulp中文版" class="headerlink" title="awesome-gulp中文版"></a><a href="https://github.com/alferov/aweso
</summary>
<category term="术" scheme="https://feahter.github.io/categories/%E6%9C%AF/"/>
<category term="gulp" scheme="https://feahter.github.io/tags/gulp/"/>
<category term="前端自动化、工程化" scheme="https://feahter.github.io/tags/%E5%89%8D%E7%AB%AF%E8%87%AA%E5%8A%A8%E5%8C%96%E3%80%81%E5%B7%A5%E7%A8%8B%E5%8C%96/"/>
</entry>
<entry>
<title>前端大神</title>
<link href="https://feahter.github.io/2016/12/08/%E5%89%8D%E7%AB%AF%E5%A4%A7%E7%A5%9E/"/>
<id>https://feahter.github.io/2016/12/08/前端大神/</id>
<published>2016-12-08T01:20:03.000Z</published>
<updated>2016-12-08T02:31:00.000Z</updated>
<content type="html"><![CDATA[<h1 id="前端大神"><a href="#前端大神" class="headerlink" title="前端大神"></a>前端大神</h1><p>达者为师，站在巨人的肩膀上眺望，才能看得更远。</p>
<h2 id="1-1-国际"><a href="#1-1-国际" class="headerlink" title="1.1 国际"></a>1.1 国际</h2><ol>
<li><h3 id="Chris-Coyier"><a href="#Chris-Coyier" class="headerlink" title="Chris Coyier"></a><a href="http://chriscoyier.net/" target="_blank" rel="external">Chris Coyier</a></h3><p><a href="http://codepen.io/" target="_blank" rel="external">Codepen</a>创始人，<a href="http://css-tricks.com/" target="_blank" rel="external">css-tricks</a>站长。</p>
<p>联系方式：<br><a href="http://codepen.io/chriscoyier" target="_blank" rel="external">CodePen</a>、 <a href="http://dribbble.com/chriscoyier" target="_blank" rel="external">Dribbble</a>、 <a href="http://twitter.com/chriscoyier" target="_blank" rel="external">Twitter</a>、 <a href="http://github.com/chriscoyier" target="_blank" rel="external">GitHub</a>、 <a href="http://instagram.com/chriscoyier" target="_blank" rel="external">Instagram</a></p>
</li>
<li><h3 id="Sara-Soueidan"><a href="#Sara-Soueidan" class="headerlink" title="Sara Soueidan"></a><a href="https://sarasoueidan.com/" target="_blank" rel="external">Sara Soueidan</a></h3><p>2015 net awards(net杂志的年度颁奖盛典)的<a href="https://thenetawards.com/longlist/developer/" target="_blank" rel="external">年度开发者</a>，2015 O’Reilly Web Platform Awards（O’Reilly，著名的IT图书出版机构）,著名的前端开发者、作者、演讲者，主要关注HTML5, SVG, CSS and JavaScript等。</p>
<p>联系方式：<br><a href="https://github.com/SaraSoueidan" target="_blank" rel="external">Github</a>、 <a href="http://tympanus.net/codrops/author/sarasoueidan/" target="_blank" rel="external">Codrops</a>、 <a href="http://alistapart.com/author/SaraSoueidan" target="_blank" rel="external">A List Apart</a>、 <a href="https://dev.opera.com/authors/sara-soueidan/" target="_blank" rel="external">Dev.Opera</a>、 <a href="http://twitter.com/SaraSoueidan" target="_blank" rel="external">Twitter</a>、 <a href="https://plus.google.com/115621441131126533845/posts" target="_blank" rel="external">Google+</a></p>
</li>
<li><h3 id="Hugo-Giraudel"><a href="#Hugo-Giraudel" class="headerlink" title="Hugo Giraudel"></a><a href="http://hugogiraudel.com/" target="_blank" rel="external">Hugo Giraudel</a></h3><p>知名的SASS专家，2015 net awards(net杂志的年度颁奖盛典)的<a href="https://thenetawards.com/longlist/developer/" target="_blank" rel="external">年度开发者</a>。法国人，现居德国柏林。</p>
<p>联系方式： <a href="https://github.com/HugoGiraudel" target="_blank" rel="external">Github</a>、 <a href="http://twitter.com/HugoGiraudel" target="_blank" rel="external">Twitter</a>、 <a href="https://www.sitepoint.com/author/hgiraudel/" target="_blank" rel="external">Sitepoint</a>、 <a href="https://plus.google.com/101697878480386449961" target="_blank" rel="external">Google+</a></p>
</li>
<li><h3 id="Lea-Verou"><a href="#Lea-Verou" class="headerlink" title="Lea Verou"></a><a href="http://lea.verou.me/" target="_blank" rel="external">Lea Verou</a></h3><p>网页设计师、前端开发者、技术极客、演讲家、作家，麻省理工学院计算机与人工智能实验室助理研究员，《CSS Secrets》作者，prefixfree.js作者，在世界各地进行过60多次演讲，<a href="http://lea.verou.me/cv.html" target="_blank" rel="external">简历</a>。希腊人，现居美国马萨诸塞州剑桥市（大波士顿地区）。</p>
<p>联系方式：<br><a href="http://twitter.com/leaverou" target="_blank" rel="external">Twitter</a>、 <a href="http://www.facebook.com/leaverou" target="_blank" rel="external">Facebook</a>、 <a href="https://github.com/LeaVerou" target="_blank" rel="external">Github</a>、 <a href="http://dribbble.com/LeaVerou" target="_blank" rel="external">Dribbble</a></p>
</li>
<li><h3 id="Paul-Irish"><a href="#Paul-Irish" class="headerlink" title="Paul Irish"></a><a href="http://paulirish.com/" target="_blank" rel="external">Paul Irish</a></h3><p>谷歌Chrome团队前端工程师，主要关注开发者工具，是<a href="http://modernizr.com/" target="_blank" rel="external">Modernizr</a>、<a href="http://yeoman.io/" target="_blank" rel="external">Yeoman</a>、<a href="http://css3please.com/" target="_blank" rel="external">CSS3 Please</a>、<a href="http://html5boilerplate.com/" target="_blank" rel="external">HTML5 Boilerplate</a>等工具的开发者，合作开发了诸多项目，详情了解他的<a href="http://www.paulirish.com/about/" target="_blank" rel="external">About</a>。</p>