├── .gitignore ├── .babelrc ├── index.html ├── README.md ├── src ├── main.js ├── App.vue └── components │ ├── rx-watch.vue │ └── rx-simple.vue ├── package.json └── webpack.config.js /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["es2015", { "modules": false }] 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | vue-rx-demo 6 | 7 | 8 |
9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Vue-rx-demo 2 | 3 | > A vue-rx demo project 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | -------------------------------------------------------------------------------- /src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import { Observable } from 'rxjs/Observable' 3 | import { Subscription } from 'rxjs/Subscription' 4 | 5 | import VueRx from 'vue-rx' 6 | 7 | import App from './App.vue' 8 | 9 | // tada! 10 | Vue.use(VueRx, { Observable, Subscription }) 11 | 12 | new Vue({ 13 | el: '#app', 14 | render: h => h(App) 15 | }) 16 | -------------------------------------------------------------------------------- /src/App.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 21 | -------------------------------------------------------------------------------- /src/components/rx-watch.vue: -------------------------------------------------------------------------------- 1 | 10 | 11 | 36 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vue-rx-demo", 3 | "description": "A vue-rx demo project", 4 | "author": "xufei ", 5 | "private": true, 6 | "scripts": { 7 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --inline --hot", 8 | "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" 9 | }, 10 | "dependencies": { 11 | "rxjs": "^5.0.0-rc.4", 12 | "vue": "^2.1.0", 13 | "vue-rx": "^2.2.0" 14 | }, 15 | "devDependencies": { 16 | "babel-core": "^6.18.2", 17 | "babel-loader": "^6.2.7", 18 | "babel-preset-es2015": "^6.18.0", 19 | "cross-env": "^3.1.3", 20 | "css-loader": "^0.25.0", 21 | "file-loader": "^0.9.0", 22 | "vue-loader": "^9.9.5", 23 | "webpack": "^2.1.0-beta.27", 24 | "webpack-dev-server": "^2.1.0-beta.11" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /src/components/rx-simple.vue: -------------------------------------------------------------------------------- 1 | 21 | 22 | 57 | -------------------------------------------------------------------------------- /webpack.config.js: -------------------------------------------------------------------------------- 1 | var path = require('path') 2 | var webpack = require('webpack') 3 | 4 | module.exports = { 5 | entry: './src/main.js', 6 | output: { 7 | path: path.resolve(__dirname, './dist'), 8 | publicPath: '/dist/', 9 | filename: 'build.js' 10 | }, 11 | module: { 12 | rules: [ 13 | { 14 | test: /\.vue$/, 15 | loader: 'vue-loader', 16 | options: { 17 | // vue-loader options go here 18 | } 19 | }, 20 | { 21 | test: /\.js$/, 22 | loader: 'babel-loader', 23 | exclude: /node_modules/ 24 | }, 25 | { 26 | test: /\.(png|jpg|gif|svg)$/, 27 | loader: 'file-loader', 28 | options: { 29 | name: '[name].[ext]?[hash]' 30 | } 31 | } 32 | ] 33 | }, 34 | resolve: { 35 | alias: { 36 | 'vue$': 'vue/dist/vue' 37 | } 38 | }, 39 | devServer: { 40 | historyApiFallback: true, 41 | noInfo: true 42 | }, 43 | devtool: '#eval-source-map' 44 | } 45 | 46 | if (process.env.NODE_ENV === 'production') { 47 | module.exports.devtool = '#source-map' 48 | // http://vue-loader.vuejs.org/en/workflow/production.html 49 | module.exports.plugins = (module.exports.plugins || []).concat([ 50 | new webpack.DefinePlugin({ 51 | 'process.env': { 52 | NODE_ENV: '"production"' 53 | } 54 | }), 55 | new webpack.optimize.UglifyJsPlugin({ 56 | sourceMap: true, 57 | compress: { 58 | warnings: false 59 | } 60 | }), 61 | new webpack.LoaderOptionsPlugin({ 62 | minimize: true 63 | }) 64 | ]) 65 | } --------------------------------------------------------------------------------