瞭解前後端聯調，認識webpack，以及ES6import命令

1.前後端聯調

1.什麼是前後端聯調？
    前後端聯合調試 調試接口
    當前後端階段性開發完一個模塊以後,前後端項目都提交,後端啓動服務,前端向服務器發送請求，看能不能拿到後端真實的數據,這個驗證雙方接口的過程就是前後端流程
2.爲什麼前後端聯調？
    前後端分離 前後端開發之前由後端制定接口文檔，接口文檔制定了每一個請求的地址 參數 請求方式;後端根據接口文檔寫代碼
3.公司什麼時候前後端聯調？
    當前後端階段性開發完一個模塊以後,前後端項目都提交,後端啓動服務,前端向服務器發送請求，看能不能拿到後端真實的數據,這個驗證雙方接口的過程就是前後端流程

2.認識webpack

	1.爲什要使用WebPack
   		 開發的文件往往需要進行額外的處理才能讓瀏覽器識別,而手動處理又是非常繁瑣的，這就爲WebPack類的工具的出現提供了需求。
	2.什麼是Webpack
   		 WebPack可以看做是模塊打包機：
   		 分析你的項目結構，找到JavaScript模塊以及其它的一些瀏覽器不能直接運行的拓展語言（less Scss，TypeScript等），並將其轉換和打包爲合適的格式供瀏覽器使用。
	3.Webpack的工作方式是：
   		 把你的項目當做一個整體，通過一個給定的主文件（如：index.js），Webpack將從這個文件開始找到你的項目的所有依賴文件，使用loaders處理它們，最後打包爲一個（或多個）瀏覽器可識別的JavaScript文件。
   		 
  	打包 : 把js進行編譯和壓縮 把大量js文件壓縮到一個js文件中 把圖片編譯成base64格式等等,當客戶端訪問這個項目時 不需要再發送那麼多次請求
    es6 let a = 10;IE10不能識別es6
    webpack會把es6編譯成es5，把less編譯成css,把ts編譯成js
    瀏覽器只識別html css js

3.ES6import命令

//導入require   導出module.exports = {}  common.js規範  AMD CMD  ES6模塊

//模塊管理
// export命令  導出    import命令  導入
//export命令 用於該模塊向其他模塊導出的接口
//import命令 用於接收其他模塊導入的值

//export 可以導出變量 也可以導出函數 class
export var a  = 100
export var b = 200

var c = 1;
var d = 2;
export {c,d}

//as 對導出的變量進行重新命名
//export  導出接口中變量和值有一一對應關係
var e = {};
var f = 2;
var g = 3
export {c as o,d as p,g};
export function f(){}
//import  導入
//import 後面是一個大括號 大括號中包含了變量的名字 這個名字必須和導出接口變量名相同
import {a} from './es6的模塊管理.js';
//as  同過as重新命名
//import命令輸入的變量是隻讀的  不能修改
//from 跟的路徑（導入模塊的路徑 可以是相對路徑 也可以是絕對路徑）
import {b as type,o} from './es6的模塊管理.js';
import {e} from './es6的模塊管理.js';
e.k = 13

//e 是個對象纔可以
// 由於import是靜態執行，所以不能使用表達式和變量，

//default 默認的 給了名

export default function() {
    console.log('foo');
    
}
// 其他模塊加載該模塊時，import命令可以爲該匿名函數指定任意名字。
//這樣寫也可以 ，foo函數的函數名foo 在模塊外部是無效的。加載的時候，視同匿名函數加載。
export default function foo() {
    console.log('foo');
    
}
import customName from 'xxx';
customName(); // 'foo'



export const A=1;
export const B=1;
export const C=1;

import * as xy from ''
//xy.A