Vue的模組化開發

為什麼需要模組化：

在我們以前編寫的js**中，因為js**從上到下執行，這樣當很多人同時編寫js時，可能a寫的變數被b修改了，當a在使用自己的變數，那麼就可能報錯，以前有乙個解決方案，就是使用函式，但是同時又出現了乙個問題，就是當a使用函式編寫js時，a在其他地方使用裡面變數，就使用不到（函式變數的作用域），這個時候就可以使用模組化開發了。

模組化的兩個核心：

1.匯出：把後期需要使用的變數、函式等匯出來

2.匯入：在需要使用變數的地方，匯入這些，即可使用

commonjs、amd、cmd，也有es6的modules

es6匯出：

export let name = '張三';

export let age = 29;
export let height = 1.88;
/** 上邊使用單個匯出，還可以使用下面方式
*let name = '張三';
let age = 29;
let height = 1.88;
* export
* */
/*也可以匯出函式和類*/
export function a()
/*匯出自定義名稱的函式：乙個模組中只能有乙個這樣的函式*/
export default function ()

es6匯入

import from './aaa.js'

//import * as info from './aaa.js' 下面使用時，就需要使用info.的形式呼叫屬性或方法
//張三 29 1.88
console.log(name,age,height);
a();
/*匯入自定義名稱的函式，需要自己定義名字*/
import run from './aaa.js'
run();

src=

"../js/aaa.js"
type
="module"
>
script
>
src=
"../js/bbb.js"
type
="module"
>
script
>

Vue 模組化開發

隨著ajax非同步請求的出現，慢慢形成了前後端的分離 function 常見的模組化規範 commonjs amd cmd，也有es6的modules modul.exports demo a,b commonjs的匯入 commonjs模組 let require modulea 等同於 let ...

Vue模組化開發

是前端分離後 執行所需要的環境 內建了npm 包管理工具 後端之於m en 2.配置國內映象 npm config set registry 3.npm install webpack g 全域性安裝webpack 4.npm insatall g vue cli init 全域性安裝vue腳手架 ...

模組化開發

講模組化開發之前，我們先了解一下 傳統開發模式 是什麼？比如說a所在的公司在做乙個專案，公司安排a跟b還有c三個人一起協同開發，a負責一部分功能塊，b負責另一部分功能塊，把專案的功能分成一塊一塊，這適用於多人協作開發，每個人負責不同的功能塊，當然，這其中有人是負責整合的，有人是負責開發公共功能塊的等...