From 0885365e4e1560f2e08f7f71725e8217cd8ecd41 Mon Sep 17 00:00:00 2001 From: Luke Shumaker Date: Sat, 6 Jan 2018 01:57:51 -0500 Subject: more --- repos.org | 83 ++++++++++++++++++++++++++++++++++++++++++++ vue-notes.md | 20 +++++++++++ vue-options.org | 106 +++++++++++++++++++++++++++++++++----------------------- 3 files changed, 166 insertions(+), 43 deletions(-) create mode 100644 repos.org diff --git a/repos.org b/repos.org new file mode 100644 index 0000000..2d82bcd --- /dev/null +++ b/repos.org @@ -0,0 +1,83 @@ +| Name | Last modified | Type | Desc | +|------------------------------------------+----------------------+--------------------+--------------------------------------------------------------------------------------| +| insert-css | 2016-07-25T01:09:50Z | ??? | ??? | +| flow-typed | 2016-06-17T09:54:32Z | ??? | ??? | +| | | | | +| babel-preset-vue-app | 2017-12-06T14:30:48Z | Bundler | ??? | +| babel-preset-vue | 2017-12-06T14:26:31Z | Bundler | JSX | +| babel-helper-vue-jsx-merge-props | 2017-12-06T02:19:52Z | Bundler | JSX | +| babel-plugin-transform-vue-jsx | 2018-01-02T09:32:33Z | Bundler | JSX support for render functions | +| | | | | +| vue-hot-reload-api | 2017-11-17T14:33:29Z | Bundler | "This is what vue-loader and vueify use under the hood." | +| vue-template-es2015-compiler | 2017-10-24T12:09:10Z | Bundler | Handle ES2015 features in render functions; claims to be used by vue-loader & vueify | +| | | | | +| vue-component-compiler | 2017-12-29T20:49:48Z | Bundler | SFC compiler; "legacy" branch merged in to vueify, "master" branch heavily WIP | +| | | | | +| rollup-plugin-vue | 2018-01-05T07:01:23Z | Bundler | Rollup | +| | | | | +| vue-loader | 2018-01-05T03:02:42Z | Bundler | WebPack | +| vue-loader / vue-html-loader | 2017-09-19T03:38:42Z | Bundler | Used by vue-loader | +| vue-loader / vue-style-loader | 2018-01-03T02:49:04Z | Bundler | Used by vue-loader | +| | | | | +| vueify | 2017-12-28T09:43:53Z | Bundler | Browserify | +| | | | | +| systemjs-plugin-vue | 2016-11-25T11:06:58Z | Bundler | abandoned | +| | | | | +| vue-ssr-html-stream | 2017-04-27T06:33:51Z | Deprecated/Bundler | See vue-server-renderer | +| eslint-config-vue | 2017-06-01T08:37:24Z | Deprecated/Devtool | | +| Discussion | 2015-09-21T21:31:53Z | Deprecated/Docs | | +| vue-async-data | 2017-08-02T09:45:51Z | Deprecated/Lib | hasn't been updated for Vue 2 | +| vue-element | 2017-06-17T20:50:17Z | Deprecated/Lib | See karol-f/vue-element instead. | +| vue-test-utils | 2018-01-04T20:22:45Z | Devtool | | +| vue-devtools | 2018-01-06T03:50:36Z | Devtool | Browser plugin | +| vue-cli | 2018-01-05T23:29:53Z | Devtool | CLI tool for boilerplate templates | +| eslint-plugin-vue | 2018-01-05T19:40:35Z | Devtool | | +| vetur | 2018-01-01T06:00:54Z | Devtool | VS Code | +| eslint-plugin-vue-libs | 2017-12-28T22:43:22Z | Devtool | | +| vue-syntax-highlight | 2017-12-15T15:44:33Z | Devtool | SFC highlighitng for Sublime Text | +| vue-migration-helper | 2017-05-07T03:47:22Z | Devtool | | +| vue-template-validator | 2016-06-06T14:03:09Z | Devtool | | +| js-repaint-perfs | 2016-03-18T01:08:13Z | Devtool/Internal | | +| awesome-vue | 2018-01-05T18:57:42Z | Docs | | +| vue-ssr-docs | 2017-12-19T10:27:31Z | Docs | | +| roadmap | 2017-12-18T17:23:24Z | Docs | | +| vue-requests | 2015-12-12T22:27:35Z | Docs | | +| vue-test-utils-mocha-webpack-example | 2018-01-01T17:40:46Z | Example | | +| vue-test-utils-jest-example | 2017-12-25T20:55:40Z | Example | | +| vue-hackernews-2.0 | 2017-12-24T17:29:23Z | Example | | +| vue-test-utils-getting-started | 2017-09-28T21:46:17Z | Example | | +| vue-router-demos | 2017-09-17T10:41:28Z | Example | | +| vue-hackernews | 2016-12-13T07:10:20Z | Example | | +| vue-webpack-meteor-example | 2015-12-14T16:35:20Z | Example | | +| todomvc | 2015-10-27T18:37:20Z | Example | | +| vue | 2018-01-05T22:46:01Z | Lib | Core library | +| vuex | 2018-01-04T16:39:10Z | Lib | State Management | +| vue-router | 2017-12-31T12:47:47Z | Lib | Router | +| vuex-router-sync | 2017-10-13T04:37:50Z | Lib | | +| vuefire | 2018-01-01T13:16:35Z | Lib/Integration | Firebase | +| vue-class-component | 2018-01-03T15:24:44Z | Lib/Integration | Use ES6 or TypeScript classes for inheritance | +| vuex-observable | 2017-12-17T23:37:34Z | Lib/Integration | integration with RxJS; early POC stage | +| vue-rx | 2017-11-08T11:48:28Z | Lib/Integration | integration with RxJS | +| vue-touch | 2017-09-19T03:38:42Z | Lib/Integration | Hammer.js | +| laravel-elixir-vue-2 | 2016-11-30T16:16:08Z | Lib/Integration | Elixir 6 | +| vue-animated-list | 2016-09-29T00:09:18Z | Lib/Plugin | | +| ~ jp.vuejs.org | 2018-01-05T20:33:42Z | Website | | +| ~ vuejs.org | 2018-01-05T20:20:10Z | Website | | +| ~ cn.vuejs.org | 2018-01-05T06:18:11Z | Website | | +| ~ it.vuejs.org | 2018-01-03T20:47:20Z | Website | | +| ~ new-issue.vuejs.org / vue-issue-helper | 2017-12-28T15:27:27Z | Website | | +| vue-curated | 2017-11-07T16:23:45Z | Website | | +| vue-curated-server | 2017-11-01T21:09:25Z | Website | | +| gitbook-plugin-theme-vuejs | 2017-10-06T14:07:27Z | Website | | +| art | 2017-08-26T17:13:53Z | Website | | +| vue-curated-client | 2017-07-20T15:24:36Z | Website | | +| ~ v1-jp.vuejs.org | 2017-05-19T09:55:33Z | Website | | +| ~ v1-cn.vuejs.org | 2016-12-23T14:30:45Z | Website | | +| ~ v1.vuejs.org | 2016-09-30T18:43:05Z | Website | | +| ~ rc.vuejs.org | 2016-09-30T04:56:16Z | Website | | +| ~ 012.vuejs.org | 2015-12-19T04:10:23Z | Website | | +| ~ 011.vuejs.org | 2015-12-19T04:10:21Z | Website | | +| ~ 012-cn.vuejs.org | 2015-11-05T18:11:29Z | Website | | +| cdnjs | 2015-10-18T04:59:55Z | Website | | +| jsdelivr | 2015-10-18T04:49:42Z | Website | | +| beautiful-open | 2014-08-15T22:11:44Z | Website | | diff --git a/vue-notes.md b/vue-notes.md index 6e2fe93..870f20a 100644 --- a/vue-notes.md +++ b/vue-notes.md @@ -230,6 +230,26 @@ TODO TODO +Once upon a time, there was library that compiled SFCs in to JS +modules (`vue-component-compiler`); there were a couple of 3rd-party +stand-alone CLI wrappers for it. That compiler got merged in to +`vueify` (the Browserify plugin for SFCs), and even though the +compiler API is still exposed there, other bundler plugins don't share +it. There's a new `vue-component-compiler` being developed, but it's +not ready yet. That means we're left with 3 *separate* SFC +"compilers" that are fairly tightly coupled with the bundle system +they're designed for. I'm sure they don't contain any nasty +differences. + + - WebPack (`vue-loader`): Presumed to be the flagship option. + + - Browserify (`vueify`): Vue 2.5.0 (2017-10-12) added the ability to + write Functional Components as SFCs. That is not yet supported in + vueify. Three months isn't a long time, but we can surmise that + Browserify is a 2nd-class citizen now. + + - Rollup (`rollup-plugin-vue`): + # misc Components don't work by literally registering custom elements with diff --git a/vue-options.org b/vue-options.org index 2899c01..9cf3af7 100644 --- a/vue-options.org +++ b/vue-options.org @@ -18,49 +18,52 @@ components; so ~this~ should be the instance of your component. * I = Instance * F = Functional Component -| C | I | F | name | type | getter | setter | desc | -|---+---+---+-----------------+--------------------------------------------------------+---------+----------+-----------------------------------------------| -| | | | Data | | | | | -|---+---+---+-----------------+--------------------------------------------------------+---------+----------+-----------------------------------------------| -| Y | | ? | ~data~ | Function () => Object | | | | -| | Y | ? | ~data~ | Object | ~$data~ | | | -| Y | Y | ? | ~props~ | Array / Object | | | | -| | Y | | ~propsData~ | Map | | | for unit testing, not real use DEVELOPMENT | -| Y | Y | ? | ~computed~ | Map | | | derivatives of ~data~, for normalization, yo! | -| Y | Y | ? | ~methods~ | Map | | | define public methods | -| Y | Y | ? | ~watch~ | Map | | | | -|---+---+---+-----------------+--------------------------------------------------------+---------+----------+-----------------------------------------------| -| | | | DOM | | | | | -|---+---+---+-----------------+--------------------------------------------------------+---------+----------+-----------------------------------------------| -| | Y | | ~el~ | String / HTMLElement | ~$el~ | ~$mount~ | | -| Y | Y | Y | ~template~ | String | | | overridden by render function | -| Y | Y | | ~render~ | (createElement: () => VNode) => VNode | | | | -| | | Y | ~render~ | (createElement: () => VNode, context) => VNode | | | | -| Y | Y | Y | ~renderError~ | (createElement: () => VNode, error: Error) => VNode | | | WORKS ONLY IN DEVELOPMENT MODE | -|---+---+---+-----------------+--------------------------------------------------------+---------+----------+-----------------------------------------------| -| | | | Lifecycle hooks | | | | | -|---+---+---+-----------------+--------------------------------------------------------+---------+----------+-----------------------------------------------| -| Y | Y | ? | ~beforeCreate~ | Function | | | see: lifecycle | -| Y | Y | ? | ~created~ | Function | | | see: lifecycle | -| Y | Y | ? | ~beforeMount~ | Function | | | | -| Y | Y | ? | ~mounted~ | Function | | | | -| Y | Y | ? | ~beforeUpdate~ | Function | | | | -| Y | Y | ? | ~updated~ | Function | | | | -| Y | Y | ? | ~activated~ | Function | | | | -| Y | Y | ? | ~deactivated~ | Function | | | | -| Y | Y | ? | ~beforeDestroy~ | Function | | | | -| Y | Y | ? | ~destroyed~ | Function | | | | -| Y | Y | ? | ~errorCaptured~ | (err: Error, vm: Component, info: string) => ?boolean | | | | -|---+---+---+-----------------+--------------------------------------------------------+---------+----------+-----------------------------------------------| -| | | | Assets | | | | | -|---+---+---+-----------------+--------------------------------------------------------+---------+----------+-----------------------------------------------| -| Y | Y | ? | ~directives~ | Map | | | | -| Y | Y | ? | ~filters~ | Map | | | | -| Y | Y | ? | ~components~ | Map | | | | -|---+---+---+-----------------+--------------------------------------------------------+---------+----------+-----------------------------------------------| -| | | | Composition | | | | | -|---+---+---+-----------------+--------------------------------------------------------+---------+----------+-----------------------------------------------| -| | | | | | | | | +| C | I | F | name | type | getter | setter | desc | +|---+---+---+-----------------+--------------------------------------------------------+-----------+----------+---------------------------------------------------------| +| | | | Data | | | | | +|---+---+---+-----------------+--------------------------------------------------------+-----------+----------+---------------------------------------------------------| +| Y | | ? | ~data~ | Function () => Object | | | | +| | Y | ? | ~data~ | Object | ~$data~ | | | +| Y | Y | ? | ~props~ | Array / Object | | | | +| | Y | | ~propsData~ | Map | | | for unit testing, not real use DEVELOPMENT | +| Y | Y | ? | ~computed~ | Map | | | derivatives of ~data~, for normalization, yo! | +| Y | Y | ? | ~methods~ | Map | | | define public methods | +| Y | Y | ? | ~watch~ | Map | | | | +|---+---+---+-----------------+--------------------------------------------------------+-----------+----------+---------------------------------------------------------| +| | | | DOM | | | | | +|---+---+---+-----------------+--------------------------------------------------------+-----------+----------+---------------------------------------------------------| +| | Y | | ~el~ | String / HTMLElement | ~$el~ | ~$mount~ | | +| Y | Y | Y | ~template~ | String | | | overridden by render function | +| Y | Y | | ~render~ | (createElement: () => VNode) => VNode | | | | +| | | Y | ~render~ | (createElement: () => VNode, context) => VNode | | | | +| Y | Y | Y | ~renderError~ | (createElement: () => VNode, error: Error) => VNode | | | WORKS ONLY IN DEVELOPMENT MODE | +|---+---+---+-----------------+--------------------------------------------------------+-----------+----------+---------------------------------------------------------| +| | | | Lifecycle hooks | | | | | +|---+---+---+-----------------+--------------------------------------------------------+-----------+----------+---------------------------------------------------------| +| Y | Y | ? | ~beforeCreate~ | Function | | | see: lifecycle | +| Y | Y | ? | ~created~ | Function | | | see: lifecycle | +| Y | Y | ? | ~beforeMount~ | Function | | | | +| Y | Y | ? | ~mounted~ | Function | | | | +| Y | Y | ? | ~beforeUpdate~ | Function | | | | +| Y | Y | ? | ~updated~ | Function | | | | +| Y | Y | ? | ~activated~ | Function | | | | +| Y | Y | ? | ~deactivated~ | Function | | | | +| Y | Y | ? | ~beforeDestroy~ | Function | | | | +| Y | Y | ? | ~destroyed~ | Function | | | | +| Y | Y | ? | ~errorCaptured~ | (err: Error, vm: Component, info: string) => ?boolean | | | | +|---+---+---+-----------------+--------------------------------------------------------+-----------+----------+---------------------------------------------------------| +| | | | Assets | | | | | +|---+---+---+-----------------+--------------------------------------------------------+-----------+----------+---------------------------------------------------------| +| Y | Y | ? | ~directives~ | Map | | | | +| Y | Y | ? | ~filters~ | Map | | | | +| Y | Y | ? | ~components~ | Map | | | | +|---+---+---+-----------------+--------------------------------------------------------+-----------+----------+---------------------------------------------------------| +| | | | Composition | | | | | +|---+---+---+-----------------+--------------------------------------------------------+-----------+----------+---------------------------------------------------------| +| | Y | ? | ~parent~ | Vue instance | ~$parent~ | | also, child is pushed on to parent's ~.$children~ array | +| ? | Y | ? | ~mixins~ | Array | | | | +| Y | ? | ? | ~extends~ | Object (options object) / Function (constructor) | | | exists to allow a SFC to extend another component | +| | | | | | | | | * Data ** data @@ -122,3 +125,20 @@ TODO ** el * Lifecycle hooks * Assets +* Composition +** extends + +#+begin_src +var CompA = Vue.extend({ ... }); +var CompB = CompA.extend({ ... }); +#+end_src + +can be written as + +#+begin_src +var CompA = Vue.extend({ ... }); +var CompB = { + extends: CompA, + ... +}; +#+end_src -- cgit v1.2.3