Meteor+Vue 从入门到放弃
前一段时间忙完公司的项目开始闲下来，打算自己写个todolist什么的小应用，然后就跑去调研了一下nodejs环境下有那些比较好的框架写后端服务，本打算用express+sequelize写restful风格API的，可惜没找到更方便的工具快速制作，然后就遇到meteor。
meteor
meteor比起express还是使用restful规范的服务端来得更先进，用起来更舒服。
简单使用，只需要在服务端定义发布数据，在客户订阅的数据并能获得，当然这是归功于基于DDP协议的socket服务。
总结一下特点：
服务端与客户端编码风格一致（全TM是javascript）
极具实时性（数据基于websocket，模板可以动态加载）
集成了开源工具和框架（webpack、vue随意使用）
快速上手教程
教程坚持使用vue和webpack，所以这里有个问题，怎么才能跟meteor很好地结合一起呢？
答案：使用在meteor安装webpack支持！尤大的证言
先学基础，不喜欢的跳过也可以。
meteor基础教程传送门
快速开始
请git clone以下
https://github.com/lpreterite/meteor-vue-webpack-example
运行只需
$ npm i$ meteor下文要讲的是，那些东西事必须的，比如在package.json这段：
# 设置的客户端与服务端入口文件"main": "src/server.js","browser": "src/client.js",webpack.config.js需要指定root和热更新设置devServer
"root": "./src", "devServer":{ "host": "localhost", "hot": true, "inline": true, },定义你的数据对象
# collections.jsexport const Tasks = new Mongo.Collection('tasks')export const Tags = new Mongo.Collection('tags')发布
# publications.jsimport {Meteor} from 'meteor/meteor';import {Tasks} from './collections';Meteor.publish('tasks', function() { return Tasks.find();});提供数据操作
# methods.jsimport {Meteor} from 'meteor/meteor';import {Tasks, Tags} from './collections';Meteor.methods({ 'tasks.complete': function(_id, complete){ Tasks.update({_id: _id}, { $set: { complete: complete, updateAt: new Date() } }) }, 'tasks.create': function(title){ check(title, String); let _id = Tasks.insert({ title, createAt: new Date() }) return _id }, 'tasks.remove': function(_id){ check(_id, String); Tasks.remove(_id); }})在客户端取得数据，和操作数据
# index.vue import {Meteor} from 'meteor/meteor'; import {Tasks} from 'server/collections'; export default{ data(){ return{ tasks: [], taskTitle: "" } }, methods: { create(){ Meteor.call('tasks.create', this.taskTitle, function(err, _id){ if(err){ alert('出错了') console.error(err) } else { this.taskTitle = ""; } }.bind(this)) }, remove(task){ Meteor.call('tasks.remove', task._id) } }, route: { activate: function(){ //订阅tasks数据 this.subscription = Meteor.subscribe('tasks'); }, data: function(transition){ Tracker.autorun(function () { //取得数据 this.tasks = Tasks.find().fetch() }.bind(this)) }, deactivate: function(){ //取消订阅tasks数据 this.subscription.shop() } } }使用docker部署meteor
使用daocloud平台(目前还是免费试用)前需要添加docker配置。
具体配置看例子的.docker目录和Dockerfile
逐步使用daocloud平台发布meteor应用
登录daocloud平台并创建一份代码构建，选择你的仓库（支持github、coding、私有gitlab等），其他默认，点击开始创建。
页面自动进入构建代码，等待一段时间后会显示构建成功。
点击镜像仓库并部署应用，逐步完成至见到环境变量设置，键入ROOT_URL=http://localhost:80、PORT=80、MONGO_URL=Mongo服务地址，然后部署。
mongo访问地址，参考一下公式：
MONGO_URL = MONGODB_USERNAME:MONGODB_PASSWORD@MONGODB_PORT_27017_TCP_ADDR:27017/MONGODB_INSTANCE_NAME具体指南
自定义部署meteor
服务器包含： nodejs、git、mongodb
$ curl https://install.meteor.com/ | sh # 安装meteor$ npm install -g demeteorizer # 安装demeteorizer$ npm install # 安装nodejs依赖的包$ meteor # 先保证应用是可以执行运行的$ demeteorizer # 打包(构建nodejs可用)代码$ cd .demeteorized/bundle/programs/server$ npm install$ cd ../../$ MONGO_URL=mongodb://localhost:27017/test PORT=80 ROOT_URL=http://localhost:80 node main.js具体指南
值得注意的是用了webpack:webpack的meteor应用部署环境nodejs版本必须0.12.x以上，npm版本必须3.x以上
关键字：meteor, node, vue.js, webpack
版权声明
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符，请点击 举报 进行投诉反馈！
