成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

vue2.0+seajs開發(fā)

wangtdgoodluck / 655人閱讀

摘要:官方推薦使用開發(fā)項(xiàng)目但是在我在打包后沒(méi)有解決好如何打包成的問(wèn)題。在頁(yè)尾,通過(guò)引入后,有一段配置代碼的簡(jiǎn)單配置加載入口模塊在下載完成后,會(huì)自動(dòng)加載入口模塊。即入口文件語(yǔ)法規(guī)范遵循規(guī)范,可以像一般書寫模塊代碼。

vue官方推薦使用webpack+vue-cli開發(fā)Vue項(xiàng)目 但是在我在webpack npm run dev 打包后沒(méi)有解決好如何打包成apk的問(wèn)題。所以就無(wú)奈的使用的seajs了。點(diǎn)擊進(jìn)入seajs官網(wǎng)

文章垃圾勿噴?。。?/p> 一、seajs簡(jiǎn)單介紹 seajs使用方法

1、下載"seajs-text.js"和"seajs-css.js"并在頁(yè)面引用,因?yàn)閟eajs不支持引用html和css。
2、在 hello.html 頁(yè)尾,通過(guò) script 引入 sea.js 后,有一段配置代碼:

// seajs 的簡(jiǎn)單配置
seajs.config({
  base: "../sea-modules/",
  alias: {
    "jquery": "jquery/jquery/1.10.1/jquery.js"
  }
})
// 加載入口模塊
seajs.use("../static/hello/src/main")

sea.js 在下載完成后,會(huì)自動(dòng)加載入口模塊。頁(yè)面中的代碼就這么簡(jiǎn)單。(main.js即入口文件)

2、seajs語(yǔ)法規(guī)范

Sea.js 遵循 CMD 規(guī)范,可以像 Node.js 一般書寫模塊代碼。使用require進(jìn)行模塊間的引用

// 所有模塊都通過(guò) define 來(lái)定義
define(function(require, exports, module) {

  // 通過(guò) require 引入依賴
  var $ = require("jquery");
  var A = require("./a");

  // 通過(guò) exports 對(duì)外提供接口
  exports.doSomething = ...

  // 或者通過(guò) module.exports 提供整個(gè)接口
  module.exports = ...

});

上面就是 Sea.js 推薦的 CMD 模塊書寫格式。如果你有使用過(guò) Node.js,一切都很自然。

二、項(xiàng)目開始 目錄結(jié)構(gòu)

css
images
js

about
user
...
main.js
seajs

lib
router
view
index.html

其實(shí)目錄還是很亂的

main.js入口文件
define(require,exports,moudle){
//通過(guò)require引用路由文件
    var Router = require("../router/router");
//定義路由對(duì)象
    var router = new VueRouter({
        history: true,
        routes:Router.router    
    });
//創(chuàng)建Vue實(shí)例
    var app = new Vue({
        el:"#app",
        router:router,
        store:store
    });
}
router.js文件
define(require,exports,moudle){
//引用home組件
    var app=require("home");
    var router = [
        {
            path: "/",
            name: "index",
            component: app.app
        }
    ]
    //向外暴露Router接口 
    exports.router = Router;
}
home.js
define(function(require,exports,moudle){
//引用html文件
    var temp=require("../views/home.tpl");
//引用首頁(yè)組件
    var index=require("index");
//引用底部組件
    var footerCom=require("components/footerCom");
    var app={
        data:function(){
            return{
            }
        },
        template:temp,
        components:{
            "index":index.index,
            "footercom":footerCom.footerCom
        }
        
    }
    exports.app=app
})
home.tpl模板
index.tpl模板

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/81518.html

相關(guān)文章

  • sea.js

    摘要:目標(biāo)了解目前公司所用得代碼模塊式開發(fā)。比較目前比較流行得框架。模塊化可以讓每個(gè)文件的職責(zé)單一,非常有利于代碼的維護(hù)。模塊定義規(guī)范與的模塊規(guī)范非常相近。一類是以國(guó)內(nèi)的等類庫(kù)為代表的大教堂模式。 目標(biāo):1.了解目前公司所用得sea.js,代碼模塊式開發(fā)。 2.比較目前比較流行得bootstrap,angularJS,reactJS框架。 參考:http://seajs.org/docs/...

    renweihub 評(píng)論0 收藏0
  • seajs和requirejs的那些事兒

    摘要:遵循的是異步模塊定義規(guī)范,遵循的是通用模塊定義規(guī)范。規(guī)范的不同,導(dǎo)致了兩者的不同。在嘗試讓第三方類庫(kù)修改自身來(lái)支持,目前只有少數(shù)社區(qū)采納。是沒(méi)有明顯的,是明顯沒(méi)有。無(wú)這方面的支持。 發(fā)布之后發(fā)現(xiàn)存在一個(gè)顯示的問(wèn)題,大家可以移步到我的簡(jiǎn)書參考,謝謝大家!??!我的簡(jiǎn)書《seajs和requirejs技術(shù)指導(dǎo)文檔》 昨天到今天,老衲翻閱數(shù)十篇技術(shù)文檔,為了搞明白seajs(CMD)和 req...

    zorpan 評(píng)論0 收藏0
  • seajs 源碼解讀

    摘要:本文主要簡(jiǎn)單地解讀一下的源碼和模塊化原理。其中,是這次源碼解讀的核心,但我也會(huì)順帶介紹一下其他文件的作用的。對(duì)代碼比較簡(jiǎn)單,其實(shí)就是聲明一下全局的命名空間。然而,真正的核心在于處理模塊依賴的問(wèn)題。 seajs 簡(jiǎn)單介紹 seajs是前端應(yīng)用模塊化開發(fā)的一種很好的解決方案。對(duì)于多人協(xié)作開發(fā)的、復(fù)雜龐大的前端項(xiàng)目尤其有用。簡(jiǎn)單的介紹不多說(shuō),大家可以到seajs的官網(wǎng)seajs.org參看...

    LiangJ 評(píng)論0 收藏0
  • 使用seajs進(jìn)行模塊管理

    摘要:一類是以國(guó)內(nèi)的等類庫(kù)為代表的大教堂模式。在大教堂模式下,所有組件都是顆?;K化的,各組件之間層層分級(jí)環(huán)環(huán)相扣。在集市模式下,所有組件彼此獨(dú)立職責(zé)單一,各組件通過(guò)組合松耦合在一起,協(xié)同完成開發(fā)兼容性持續(xù)更新中。。。 前端模塊化開發(fā)的價(jià)值 解決命名沖突 我們做項(xiàng)目是常常會(huì)做一些通用功能的封裝,封裝成一個(gè)個(gè)的函數(shù),然后保存在一個(gè)名叫util.js的文件中.這種情況就很有可能在另一個(gè)開發(fā)人員...

    saucxs 評(píng)論0 收藏0
  • JavaScript_模塊化

    摘要:默認(rèn)會(huì)有三個(gè)參數(shù),,也可以接受兩個(gè)以上的參數(shù),字符串表示模塊標(biāo)識(shí)。獲取模塊的接口調(diào)用模塊中的定義方法模塊內(nèi)部異步加載模塊,并在加載完成后執(zhí)行指定的回調(diào)函數(shù)。對(duì)象,這種方式可以將模塊內(nèi)部多個(gè)屬性多個(gè)方法暴露出來(lái)。是在自己模塊的作用域中。 JS開發(fā)的問(wèn)題 沖突 依賴 JS引入的文件,產(chǎn)生依賴. 使用命名空間解決: 命名空間的弊端 調(diào)用的時(shí)候 名字比較長(zhǎng). 只能減低沖突,不能完全避免 ...

    dkzwm 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<