From 7d893808d1b14c4f4709537255121ce2d2d533d4 Mon Sep 17 00:00:00 2001 From: Evan You Date: Wed, 3 Aug 2016 12:16:46 -0400 Subject: [PATCH] adjust build setup --- build/build.js | 72 ------- build/rollup.config.js | 16 ++ examples/chat/vuex/store.js | 2 +- examples/shopping-cart/vuex/store.js | 2 +- package.json | 8 +- src/helpers.js | 4 +- src/index.js | 1 - test/e2e/todomvc.js | 272 --------------------------- test/unit/test.js | 2 +- 9 files changed, 26 insertions(+), 353 deletions(-) delete mode 100644 build/build.js create mode 100644 build/rollup.config.js delete mode 100644 test/e2e/todomvc.js diff --git a/build/build.js b/build/build.js deleted file mode 100644 index 27440047c..000000000 --- a/build/build.js +++ /dev/null @@ -1,72 +0,0 @@ -process.env.BABEL_ENV = 'production' - -var fs = require('fs') -var zlib = require('zlib') -var rollup = require('rollup') -var uglify = require('uglify-js') -var babel = require('rollup-plugin-babel') -var version = process.env.VERSION || require('../package.json').version - -var banner = - '/*!\n' + - ' * Vuex v' + version + '\n' + - ' * (c) ' + new Date().getFullYear() + ' Evan You\n' + - ' * Released under the MIT License.\n' + - ' */' - -rollup.rollup({ - entry: 'src/index.js', - plugins: [babel()] -}) -.then(function (bundle) { - var code = bundle.generate({ - format: 'umd', - banner: banner, - moduleName: 'Vuex' - }).code - return write('dist/vuex.js', code).then(function () { - return code - }) -}) -.then(function (code) { - var minified = banner + '\n' + uglify.minify(code, { - fromString: true, - output: { - ascii_only: true - } - }).code - return write('dist/vuex.min.js', minified) -}) -.then(function () { - return rollup.rollup({ - entry: 'src/plugins/logger.js', - plugins: [babel()] - }).then(function (bundle) { - return write('logger.js', bundle.generate({ - format: 'cjs' - }).code) - }) -}) -.catch(logError) - -function write (dest, code) { - return new Promise(function (resolve, reject) { - fs.writeFile(dest, code, function (err) { - if (err) return reject(err) - console.log(blue(dest) + ' ' + getSize(code)) - resolve() - }) - }) -} - -function getSize (code) { - return (code.length / 1024).toFixed(2) + 'kb' -} - -function logError (e) { - console.log(e) -} - -function blue (str) { - return '\x1b[1m\x1b[34m' + str + '\x1b[39m\x1b[22m' -} diff --git a/build/rollup.config.js b/build/rollup.config.js new file mode 100644 index 000000000..81df2789b --- /dev/null +++ b/build/rollup.config.js @@ -0,0 +1,16 @@ +const buble = require('rollup-plugin-buble') +const version = process.env.VERSION || require('../package.json').version + +module.exports = { + entry: 'src/index.js', + dest: 'dist/vuex.js', + format: 'umd', + moduleName: 'Vuex', + plugins: [buble()], + banner: +`/** + * vuex v${version} + * (c) ${new Date().getFullYear()} Evan You + * @license MIT + */` +} diff --git a/examples/chat/vuex/store.js b/examples/chat/vuex/store.js index 1c9f2e228..6feb29e2b 100644 --- a/examples/chat/vuex/store.js +++ b/examples/chat/vuex/store.js @@ -1,5 +1,5 @@ import Vue from 'vue' -import Vuex from '../../../src' +import Vuex from 'vuex' import * as getters from './getters' import * as actions from './actions' import mutations from './mutations' diff --git a/examples/shopping-cart/vuex/store.js b/examples/shopping-cart/vuex/store.js index 4373d2d76..538e91f85 100644 --- a/examples/shopping-cart/vuex/store.js +++ b/examples/shopping-cart/vuex/store.js @@ -1,5 +1,5 @@ import Vue from 'vue' -import Vuex from '../../../src' +import Vuex from 'vuex' import * as actions from './actions' import * as getters from './getters' import cart from './modules/cart' diff --git a/package.json b/package.json index 153ca191c..9e61b8ada 100644 --- a/package.json +++ b/package.json @@ -10,10 +10,11 @@ ], "scripts": { "dev": "node examples/server.js", + "dev:dist": "rollup -wm -c build/rollup.config.js", + "build": "rollup -c build/rollup.config.js && uglifyjs dist/vuex.js -cm --comments -o dist/vuex.min.js", "test": "eslint src && npm run test:unit && npm run test:e2e", - "test:unit": "jasmine JASMINE_CONFIG_PATH=test/unit/jasmine.json", + "test:unit": "rollup -c build/rollup.config.js && jasmine JASMINE_CONFIG_PATH=test/unit/jasmine.json", "test:e2e": "node test/e2e/runner.js", - "build": "node build/build.js", "release": "bash build/release.sh", "docs": "cd docs && gitbook serve", "docs:deploy": "cd docs && ./deploy.sh" @@ -48,7 +49,8 @@ "nightwatch-helpers": "^1.1.0", "phantomjs-prebuilt": "^2.1.7", "rollup": "^0.34.1", - "rollup-plugin-babel": "^2.4.0", + "rollup-plugin-buble": "^0.12.1", + "rollup-watch": "^2.5.0", "selenium-server": "^2.53.1", "todomvc-app-css": "^2.0.3", "uglify-js": "^2.6.2", diff --git a/src/helpers.js b/src/helpers.js index 82b16338e..54c729820 100644 --- a/src/helpers.js +++ b/src/helpers.js @@ -14,7 +14,7 @@ export function mapMutations (mutations) { const res = {} normalizeMap(mutations).forEach(({ key, val }) => { res[key] = function mappedMutation (...args) { - return this.$store.commit(val, ...args) + return this.$store.commit.apply(this.$store, [val].concat(args)) } }) return res @@ -37,7 +37,7 @@ export function mapActions (actions) { const res = {} normalizeMap(actions).forEach(({ key, val }) => { res[key] = function mappedAction (...args) { - return this.$store.dispatch(val, ...args) + return this.$store.dispatch.apply(this.$store, [val].concat(args)) } }) return res diff --git a/src/index.js b/src/index.js index 14c2bca7f..5f0013f00 100644 --- a/src/index.js +++ b/src/index.js @@ -253,7 +253,6 @@ function initModule (store, path, module, hot) { // set state if (!isRoot && !hot) { const parentState = getNestedState(store.state, path.slice(0, -1)) - if (!parentState) debugger const moduleName = path[path.length - 1] Vue.set(parentState, moduleName, state || {}) } diff --git a/test/e2e/todomvc.js b/test/e2e/todomvc.js deleted file mode 100644 index 7bc2ecc4b..000000000 --- a/test/e2e/todomvc.js +++ /dev/null @@ -1,272 +0,0 @@ -casper.test.begin('todomvc', 57, function (test) { - casper - .start('examples/todomvc/index.html') - .then(function () { - test.assertNotVisible('.main', '.main should be hidden') - test.assertNotVisible('.footer', '.footer should be hidden') - .assert.count('.filters .selected', 1, 'should have one filter selected') - .assert.containsText('.filters .selected', 'All', 'default filter should be "All"') - }) - - // let's add a new item ----------------------------------------------- - - .then(function () { - casper.sendKeys('.new-todo', 'test') - }) - .then(function () { - // wait before hitting enter - // so v-model unlocks - createNewItem() - }) - .then(function () { - .assert.count('.todo', 1, 'new item should be created') - test.assertNotVisible('.todo .edit', 'new item edit box should be hidden') - .assert.containsText('.todo label', 'test', 'new item should have correct label text') - .assert.containsText('.todo-count strong', '1', 'remaining count should be 1') - test.assertEvalEquals(function () { - return __utils__.findOne('.todo .toggle').checked - }, false, 'new item toggle should not be checked') - test.assertVisible('.main', '.main should now be visible') - test.assertVisible('.footer', '.footer should now be visible') - test.assertNotVisible('.clear-completed', '.clear-completed should be hidden') - test.assertField({type: 'css', path: '.new-todo'}, '', 'new todo input should be reset') - }) - - // add another item --------------------------------------------------- - - .then(function () { - createNewItem('test2') - }) - .then(function () { - .assert.count('.todo', 2, 'should have 2 items now') - .assert.containsText('.todo:nth-child(2) label', 'test2', 'new item should have correct label text') - .assert.containsText('.todo-count strong', '2', 'remaining count should be 2') - }) - - // mark one item as completed ----------------------------------------- - - .thenClick('.todo .toggle', function () { - .assert.count('.todo.completed', 1, 'should have 1 item completed') - test.assertEval(function () { - return __utils__.findOne('.todo').classList.contains('completed') - }, 'it should be the first one') - .assert.containsText('.todo-count strong', '1', 'remaining count should be 1') - test.assertVisible('.clear-completed', '.clear-completed should now be visible') - }) - - // add yet another item ----------------------------------------------- - - .then(function () { - createNewItem('test3') - }) - .then(function () { - .assert.count('.todo', 3, 'should have 3 items now') - .assert.containsText('.todo:nth-child(3) label', 'test3', 'new item should have correct label text') - .assert.containsText('.todo-count strong', '2', 'remaining count should be 2') - }) - - // add moreeee, now we assume they all work properly ------------------ - - .then(function () { - createNewItem('test4') - createNewItem('test5') - }) - .then(function () { - .assert.count('.todo', 5, 'should have 5 items now') - .assert.containsText('.todo-count strong', '4', 'remaining count should be 4') - }) - - // check more as completed -------------------------------------------- - .then(function () { - this.click('.todo:nth-child(4) .toggle') - this.click('.todo:nth-child(5) .toggle') - }) - .then(function () { - .assert.count('.todo.completed', 3, 'should have 3 item completed') - .assert.containsText('.todo-count strong', '2', 'remaining count should be 2') - }) - - // remove a completed item -------------------------------------------- - - .thenClick('.todo:nth-child(1) .destroy', function () { - .assert.count('.todo', 4, 'should have 4 items now') - .assert.count('.todo.completed', 2, 'should have 2 item completed') - .assert.containsText('.todo-count strong', '2', 'remaining count should be 2') - }) - - // remove a incompleted item ------------------------------------------ - - .thenClick('.todo:nth-child(2) .destroy', function () { - .assert.count('.todo', 3, 'should have 3 items now') - .assert.count('.todo.completed', 2, 'should have 2 item completed') - .assert.containsText('.todo-count strong', '1', 'remaining count should be 1') - }) - - // remove all completed ------------------------------------------------ - - .thenClick('.clear-completed', function () { - .assert.count('.todo', 1, 'should have 1 item now') - .assert.containsText('.todo label', 'test2', 'the remaining one should be the second one') - .assert.count('.todo.completed', 0, 'should have no completed items now') - .assert.containsText('.todo-count strong', '1', 'remaining count should be 1') - test.assertNotVisible('.clear-completed', '.clear-completed should be hidden') - }) - - // prepare to test filters ------------------------------------------------ - .then(function () { - createNewItem('test') - createNewItem('test') - }) - .then(function () { - this.click('.todo:nth-child(2) .toggle') - this.click('.todo:nth-child(3) .toggle') - }) - - // active filter ---------------------------------------------------------- - .thenClick('.filters li:nth-child(2) a', function () { - .assert.count('.todo', 1, 'filter active should have 1 item') - .assert.count('.todo.completed', 0, 'visible items should be incomplete') - }) - - // add item with filter active -------------------------------------------- - // mostly make sure v-repeat works well with v-if - .then(function () { - createNewItem('test') - }) - .then(function () { - .assert.count('.todo', 2, 'should be able to create new item when fitler active') - }) - - // completed filter ------------------------------------------------------- - .thenClick('.filters li:nth-child(3) a', function () { - .assert.count('.todo', 2, 'filter completed should have 2 items') - .assert.count('.todo.completed', 2, 'visible items should be completed') - }) - - // toggling todos when filter is active ----------------------------------- - .thenClick('.todo .toggle', function () { - .assert.count('.todo', 1, 'should have only 1 item left') - }) - .thenClick('.filters li:nth-child(2) a', function () { - .assert.count('.todo', 3, 'should have only 3 items now') - }) - .thenClick('.todo .toggle', function () { - .assert.count('.todo', 2, 'should have only 2 items now') - }) - - // test editing triggered by blur ------------------------------------------ - .thenClick('.filters li:nth-child(1) a') - .then(function () { - doubleClick('.todo:nth-child(1) label') - }) - .then(function () { - .assert.count('.todo.editing', 1, 'should have one item being edited') - test.assertEval(function () { - var input = document.querySelector('.todo:nth-child(1) .edit') - return input === document.activeElement - }, 'edit input should be focused') - }) - .then(function () { - resetField() - this.sendKeys('.todo:nth-child(1) .edit', 'edited!') // doneEdit triggered by blur - }) - .then(function () { - .assert.count('.todo.editing', 0, 'item should no longer be edited') - .assert.containsText('.todo:nth-child(1) label', 'edited!', 'item should have updated text') - }) - - // test editing triggered by enter ---------------------------------------- - .then(function () { - doubleClick('.todo label') - }) - .then(function () { - resetField() - this.sendKeys('.todo:nth-child(1) .edit', 'edited again!', { keepFocus: true }) - keyUp(13) // Enter - }) - .then(function () { - .assert.count('.todo.editing', 0, 'item should no longer be edited') - .assert.containsText('.todo:nth-child(1) label', 'edited again!', 'item should have updated text') - }) - - // test cancel ------------------------------------------------------------ - .then(function () { - doubleClick('.todo label') - }) - .then(function () { - resetField() - this.sendKeys('.todo:nth-child(1) .edit', 'cancel test', { keepFocus: true }) - keyUp(27) // ESC - }) - .then(function () { - .assert.count('.todo.editing', 0, 'item should no longer be edited') - .assert.containsText('.todo label', 'edited again!', 'item should not have updated text') - }) - - // test empty input remove ------------------------------------------------ - .then(function () { - doubleClick('.todo label') - }) - .then(function () { - resetField() - this.sendKeys('.todo:nth-child(1) .edit', ' ') - }) - .then(function () { - .assert.count('.todo', 3, 'item should have been deleted') - }) - - // test toggle all - .thenClick('.toggle-all', function () { - .assert.count('.todo.completed', 3, 'should toggle all items to completed') - }) - .thenClick('.toggle-all', function () { - .assert.count('.todo:not(.completed)', 3, 'should toggle all items to active') - }) - - // run - .run(function () { - test.done() - }) - - // helper =============== - - function createNewItem (text) { - if (text) { - casper.sendKeys('.new-todo', text) - } - casper.evaluate(function () { - // casper.mouseEvent can't set keyCode - var field = document.querySelector('.new-todo') - var e = document.createEvent('HTMLEvents') - e.initEvent('keyup', true, true) - e.keyCode = 13 - field.dispatchEvent(e) - }) - } - - function doubleClick (selector) { - casper.evaluate(function (selector) { - var el = document.querySelector(selector) - var e = document.createEvent('MouseEvents') - e.initMouseEvent('dblclick', true, true, null, 1, 0, 0, 0, 0, false, false, false, false, 0, null) - el.dispatchEvent(e) - }, selector) - } - - function keyUp (code) { - casper.evaluate(function (code) { - var input = document.querySelector('.todo:nth-child(1) .edit') - var e = document.createEvent('HTMLEvents') - e.initEvent('keyup', true, true) - e.keyCode = code - input.dispatchEvent(e) - }, code) - } - - function resetField () { - // somehow casper.sendKey() option reset:true doesn't work - casper.evaluate(function () { - document.querySelector('.todo:nth-child(1) .edit').value = '' - }) - } -}) diff --git a/test/unit/test.js b/test/unit/test.js index 48900b7e5..35fdd20bc 100644 --- a/test/unit/test.js +++ b/test/unit/test.js @@ -1,6 +1,6 @@ import 'babel-polyfill' import Vue from 'vue' -import Vuex, { mapState, mapMutations, mapGetters, mapActions } from '../../build/dev-entry' +import Vuex, { mapState, mapMutations, mapGetters, mapActions } from '../../dist/vuex.js' Vue.use(Vuex)