vue官方引荐运用webpack+vue-cli开辟Vue项目 但是在我在webpack npm run dev 打包后没有解决好怎样打包成apk的题目。所以就无法的运用的seajs了。点击进入seajs官网

文章渣滓勿喷！！！

一、seajs简朴引见

seajs运用方法

1、下载”seajs-text.js”和”seajs-css.js”并在页面援用，由于seajs不支持援用html和css。
2、在 hello.html 页尾，经由过程 script 引入 sea.js 后，有一段设置代码：

// seajs 的简朴设置
seajs.config({
  base: "../sea-modules/",
  alias: {
    "jquery": "jquery/jquery/1.10.1/jquery.js"
  }
})
// 加载进口模块
seajs.use("../static/hello/src/main")

sea.js 在下载完成后，会自动加载进口模块。页面中的代码就这么简朴。(main.js即进口文件)

2、seajs语法范例

Sea.js 遵照 CMD 范例，能够像 Node.js 平常誊写模块代码。运用require举行模块间的援用

// 统统模块都经由过程 define 来定义
define(function(require, exports, module) {

  // 经由过程 require 引入依靠
  var $ = require('jquery');
  var A = require('./a');

  // 经由过程 exports 对外供应接口
  exports.doSomething = ...

  // 或许经由过程 module.exports 供应全部接口
  module.exports = ...

});

上面就是 Sea.js 引荐的 CMD 模块誊写花样。假如你有运用过 Node.js，统统都很天然。

二、项目最先

目次构造

css
images
js

about
user
…
main.js
seajs

lib
router
view
index.html

实在目次照样很乱的

main.js进口文件

define(require,exports,moudle){
//经由过程require援用路由文件
    var Router = require("../router/router");
//定义路由对象
    var router = new VueRouter({
        history: true,
        routes:Router.router    
    });
//建立Vue实例
    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");
//援用首页组件
    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模板

<div>
    <index></index>
    <footercom></footercom>
</div>

index.tpl模板

<div>
    <header id="header" class="mui-bar mui-bar-nav header">
        <h1 class="mui-title header_tit" id="tit">***</h1>
    </header>
<div>