资讯专栏INFORMATION COLUMN

mvvm框架--san.js 学习笔记(一)

zhangrxiang / 1133人阅读

摘要:最近,由于公司项目需要,使用百度框架开发了一个兼容的小项目。是框架,和有一些类似。和相比,优势是能兼容,但没有那么简单易用,学习最好有一些框架的基础。当初我自己好奇,尝试用做了一个小型项目,这里记录一下。

最近,由于公司项目需要,使用百度mvvm框架san开发了一个兼容ie6的小项目。san是mvvm框架,和vue有一些类似。和vue相比,优势是能兼容ie6,但没有vue那么简单易用,学习san最好有一些mvvm框架的基础。当然最让人头疼的是社区,现在随便一搜,少有关于san的文章(除了官方文档),这对初学者来说是很难的。当初我自己好奇,尝试用san做了一个小型项目,这里记录一下。如果你也想尝试一下,也许我的文章会对你有一些帮助。

我将从零开始,用san做一个demo,做一个记录。好,直接开始,做一个简单的。

Quik start 项目结构

1、index.html




    
    
    
    mySan


    
    

2、 package.json

{
  "name": "start",
  "version": "1.0.0",
  "description": "demo by yongchaoo",
  "scripts": {
    "test": "echo "Error: no test specified" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "browser-sync": "^2.26.0",
    "http-proxy-middleware": "^0.19.0"
  }
}

3、app.js

var browserSync = require("browser-sync").create();
var proxy = require("http-proxy-middleware")
var devApi = "http://www.api.com/" // 后台api

var middleware = proxy("/api/**", { // **:匹配所有请求路径
    target: devApi, 
    changeOrigin: true, 
    pathRewrite: {"^/api" : "/api"}}); //重写路由

function Server() {
    var bs = browserSync.init({
        port: 8001,
        server: {
            directory: true,
            baseDir: ["./"],
        },
        open: true,
        middleware: [middleware],
        startPath: "/index.html"
    })
    browserSync.watch("**").on("change", browserSync.reload); // 添加监听,项目文件改动保存,浏览器自动刷新
}
Server();
get start
$ cd start

$ npm i

$ node app.js

本例:源码

感兴趣的继续关注,有时间再写。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/98670.html

相关文章

  • 学习MVVM框架的双向绑定笔记

    摘要:的数据劫持版本内部使用了来实现数据与视图的双向绑定,体现在对数据的读写处理过程中。这样就形成了数据的双向绑定。 MVVM由以下三个内容组成 View:视图模板 Model:数据模型 ViewModel:作为桥梁负责沟通View和Model,自动渲染模板 在JQuery时期,如果需要刷新UI时,需要先取到对应的DOM再更新UI,这样数据和业务的逻辑就和页面有强耦合。 在MVVM中,U...

    VioletJack 评论0 收藏0
  • 基于Vue的MVVM学习笔记

    摘要:发布订阅现在每个人应该都用微信吧,一个人可以关注多个公众号,多个人可以同时关注相同的公众号。公众号每周都会更新内容,并推送给我们,把写好的文章在微信管理平台更新就好了,点击推送,就相当于发布。 什么是MVVM MVVM——Model-View-ViewModle的缩写,MVC设计模式的改进版。Model是我们应用中的数据模型,View是我们的UI层,通过ViewModle,可以把我们M...

    Alan 评论0 收藏0
  • Android开源架构

    摘要:音乐团队分享数据绑定运行机制分析一个项目搞定所有主流架构单元测试一个项目搞定所有主流架构系列的第二个项目。代码开源,展示了的用法,以及如何使用进行测试,还有用框架对的进行单元测试。 Android 常用三方框架的学习 Android 常用三方框架的学习 likfe/eventbus3-intellij-plugin AS 最新可用 eventbus3 插件,欢迎品尝 简单的 MVP 模...

    sutaking 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<