【文章內(nèi)容簡介】 日志或添加全局常量的 * * Environment helpers */ new DefinePlugin({ 39。ENV39。: (), 39。HMR39。: , 39。39。: { 39。ENV39。: (), 39。NODE_ENV39。: (), 39。HMR39。: , } }), new DllBundlesPlugin({ bundles: { polyfills: [ 39。corejs39。, { name: 39。39。, path: 39。39。 }, { name: 39。39。, path: 39。39。 }, 39。tshelpers39。, ], vendor: [ 39。@angular/platformbrowser39。, 39。@angular/platformbrowserdynamic39。, 39。@angular/core39。, 39。@angular/mon39。, 39。@angular/forms39。, 39。@angular/39。, 39。@angular/router39。, 39。@angularclass/hmr39。, 39。rxjs39。, ] }, dllDir: (39。dll39。), webpackConfig: webpackMergeDll(monConfig({env: ENV}), { devtool: 39。cheapmodulesourcemap39。, plugins: [] }) }), new AddAssetHtmlPlugin([ { filepath: (`dll/${(39。polyfills39。)}`) }, { filepath: (`dll/${(39。vendor39。)}`) } ]), /** * Plugin: NamedModulesPlugin (experimental) * 使用文件名作為模塊名。 */ // new NamedModulesPlugin(), /** * Plugin LoaderOptionsPlugin (experimental) * */ new LoaderOptionsPlugin({ debug: true, options: { } }), ], /** * WebPACK開發(fā)服務(wù)器配置 */ devServer: { port: , host: , historyApiFallback: true, watchOptions: { aggregateTimeout: 300, poll: 1000 } }, node: { global: true, crypto: 39。empty39。, process: true, module: false, clearImmediate: false, setImmediate: false } })。} 使用Angular2開始項目 主頁 !DOCTYPE htmlhtmlhead meta charset=utf8 meta equiv=xuapatible content=ie=edge meta name=viewport content=width=devicewidth, initialscale=1 title%= %/title meta name=description content=%= % % if () { % ! Configured Head Tags %= % % } % ! base url base href=%= %/headbodyapp div class=loader div class=line/div div class=line/div div class=line/div div class=line/div div class=line/div div class=line/div div class=line/div div class=line/div div class=line/div /div/app! Google Analytics: change UA710731751 to be your site39。s ID script (function (A, n, g, u, l, a, r) { = r。 A[l] = A[l] || function () { (A[l].q = A[l].q || []).push(arguments) }, A[l].l = 1 * new Date()。 a = (g), r = (g)[0]。 = 1。 = u。 (a, r) })(window, document, 39。script39。, 39。39。, 39。ga39。)。 ga(39。create39。, 39。UA71073175139。, 39。auto39。)。 ga(39。send39。, 39。pageview39。)。/script% if ( amp。amp。 !== true) { %! Webpack Dev Server reload script src=//script% } %/body/html主頁中僅一個app組件，之后所有組件都放在其中4 功能 游戲功能結(jié)構(gòu)圖游戲面板包括了游戲大部分主體和功能，包括實現(xiàn)按鍵控制方塊移動，游戲中的邏輯等等，面板代碼：div class=gamewrapper (swipeleft)=clickKeyBoard(37) (swipeup)=clickKeyBoard(38) (swiperight)=clickKeyBoard(39) (swipedown)=clickKeyBoard(40) section class=gamepanel div board class=board (window:keydown)=clickKeyBoard($) div class=gameboard game4board div class=gridboard appgamecell *ngFor=let item of grid。 [gameState]=gameState/appgamecell /div div class=tileboard gametilecell *ngFor=let tile of tiles。 trackBy: trackByFn class=tilecell position{{}}{{}} []= [tile]=tile [gameState]=gameState/gametilecell /div /div div class=ga