adjust build

benchmarks/ssr/renderToStream.js

@@ -1,6 +1,6 @@
 'use strict'
 
-const Vue = require('../../dist/vue.common.js')
+const Vue = require('../../dist/vue.runtime.common.js')
 const createRenderer = require('../../packages/vue-server-renderer').createRenderer
 const renderToStream = createRenderer().renderToStream
 const gridComponent = require('./common.js')

benchmarks/ssr/renderToString.js

@@ -1,6 +1,6 @@
 'use strict'
 
-const Vue = require('../../dist/vue.common.js')
+const Vue = require('../../dist/vue.runtime.common.js')
 const createRenderer = require('../../packages/vue-server-renderer').createRenderer
 const renderToString = createRenderer().renderToString
 const gridComponent = require('./common.js')

build/build.js

@@ -69,37 +69,34 @@ function buildEntry (config) {
           pure_funcs: ['makeMap']
         }
       }).code
-      return write(config.dest, minified).then(zip(config.dest))
+      return write(config.dest, minified, true)
     } else {
       return write(config.dest, code)
     }
   })
 }
 
-function write (dest, code) {
-  return new Promise(function (resolve, reject) {
-    fs.writeFile(dest, code, function (err) {
-      if (err) return reject(err)
-      console.log(blue(path.relative(process.cwd(), dest)) + ' ' + getSize(code))
+function write (dest, code, zip) {
+  return new Promise((resolve, reject) => {
+    function report (extra) {
+      console.log(blue(path.relative(process.cwd(), dest)) + ' ' + getSize(code) + (extra || ''))
       resolve()
+    }
+
+    fs.writeFile(dest, code, err => {
+      if (err) return reject(err)
+      if (zip) {
+        zlib.gzip(code, (err, zipped) => {
+          if (err) return reject(err)
+          report(' (gzipped: ' + getSize(zipped) + ')')
+        })
+      } else {
+        report()
+      }
     })
   })
 }
 
-function zip (file) {
-  return function () {
-    return new Promise(function (resolve, reject) {
-      fs.readFile(file, function (err, buf) {
-        if (err) return reject(err)
-        zlib.gzip(buf, function (err, buf) {
-          if (err) return reject(err)
-          write(file + '.gz', buf).then(resolve)
-        })
-      })
-    })
-  }
-}
-
 function getSize (code) {
   return (code.length / 1024).toFixed(2) + 'kb'
 }

build/config.js

@@ -14,30 +14,38 @@ const banner =
 
 const builds = {
   // Runtime only (CommonJS). Used by bundlers e.g. Webpack & Browserify
-  'web-runtime-dev': {
+  'web-runtime-cjs': {
     entry: path.resolve(__dirname, '../src/entries/web-runtime.js'),
-    dest: path.resolve(__dirname, '../dist/vue.common.js'),
+    dest: path.resolve(__dirname, '../dist/vue.runtime.common.js'),
     format: 'cjs',
     banner
   },
-  // runtime-only build for CDN
-  'web-runtime-cdn-dev': {
+  // Runtime+compiler CommonJS build (CommonJS)
+  'web-full-cjs': {
+    entry: path.resolve(__dirname, '../src/entries/web-runtime-with-compiler.js'),
+    dest: path.resolve(__dirname, '../dist/vue.common.js'),
+    format: 'cjs',
+    alias: { he: './entity-decoder' },
+    banner
+  },
+  // runtime-only build (Browser)
+  'web-runtime-dev': {
     entry: path.resolve(__dirname, '../src/entries/web-runtime.js'),
     dest: path.resolve(__dirname, '../dist/vue.runtime.js'),
     format: 'umd',
     env: 'development',
     banner
   },
-  // runtime-only production build for CDN
-  'web-runtime-cdn-prod': {
+  // runtime-only production build (Browser)
+  'web-runtime-prod': {
     entry: path.resolve(__dirname, '../src/entries/web-runtime.js'),
     dest: path.resolve(__dirname, '../dist/vue.runtime.min.js'),
     format: 'umd',
     env: 'production',
     banner
   },
-  // Runtime+compiler standalone development build.
-  'web-standalone-dev': {
+  // Runtime+compiler development build (Browser)
+  'web-full-dev': {
     entry: path.resolve(__dirname, '../src/entries/web-runtime-with-compiler.js'),
     dest: path.resolve(__dirname, '../dist/vue.js'),
     format: 'umd',
@@ -45,8 +53,8 @@ const builds = {
     alias: { he: './entity-decoder' },
     banner
   },
-  // Runtime+compiler standalone production build.
-  'web-standalone-prod': {
+  // Runtime+compiler production build  (Browser)
+  'web-full-prod': {
     entry: path.resolve(__dirname, '../src/entries/web-runtime-with-compiler.js'),
     dest: path.resolve(__dirname, '../dist/vue.min.js'),
     format: 'umd',
@@ -100,8 +108,7 @@ function genConfig (opts) {
 
   if (opts.env) {
     config.plugins.push(replace({
-      'process.env.NODE_ENV': JSON.stringify(opts.env),
-      'process.env.VUE_ENV': JSON.stringify('client')
+      'process.env.NODE_ENV': JSON.stringify(opts.env)
     }))
   }
 

dist/README.md

@@ -0,0 +1,39 @@
+## Explanation of Build Files
+
+- ### vue.js
+
+  The full (compiler-included) browser build. This is the build you can just include with a script tag:
+
+  ```
+  <script src="https://unkpg.com/vue/dist/vue.js"><script>
+  ```
+
+  Note that this build is hard-coded to development mode.
+
+- ### vue.min.js
+
+  Same as `vue.js`, but minified AND is hard-coded to production mode (with runtime checks and warnings stripped).
+
+- ### vue.common.js
+
+  The full (compiler-included) CommonJS build. This is the build intended to be used with a Node-compatible bundler, e.g. Webpack or Browserify.
+
+  The difference between the browser build and the CommonJS build is that the latter preserves the `process.env.NODE_ENV` check for development/production modes (defaults to development mode). This gives you more control over what mode the code should run in:
+
+  - When bundling for the browser, you can turn on production mode by using Webpack's [DefinePlugin](https://webpack.github.io/docs/list-of-plugins.html#defineplugin) or Browserify's [envify](https://github.com/hughsk/envify) to replace `process.env.NODE_ENV` with the `"production"` string literal. This also allows minifiers to completely drop the warnings inside the conditional blocks. See [examples](http://vuejs.org/v2/guide/deployment.html).
+
+  - When running Vue in Node.js (during server side rendering), Vue will pick up the actual `process.env.NODE_ENV` if set.
+
+- ### vue.runtime.common.js
+
+  The runtime-only (compiler-excluded) CommonJS build. **This is the default build you get from `import Vue from 'vue'` or `var Vue = require('vue')`**.
+
+  This build does not support the `template` option, because it doesn't include the compiler. It is thus 30% lighter than the full build. However, you can still use templates in Single-File `*.vue` components via `vue-loader` or `vueify`, as these tools will pre-compile the templates into render functions for you.
+
+- ### vue.runtime.js
+
+  The runtime-only (compiler-excluded) browser build. You can also include this build with a script tag, but with this build, you will **not** be able to use the `template` option. Hard-coded to development mode.
+
+- ### vue.runtime.min.js
+
+  Same as `vue.runtime.js`, but minified AND hard-coded to production mode (with runtime checks and warnings stripped).

flow/compiler.js

@@ -1,6 +1,5 @@
 declare type CompilerOptions = {
   warn?: Function; // allow customizing warning in different environments; e.g. node
-  isIE?: boolean; // for detecting IE SVG innerHTML bug
   expectHTML?: boolean; // only false for non-web builds
   modules?: Array<ModuleOptions>; // platform specific modules; e.g. style; class
   staticKeys?: string; // a list of AST properties to be considered static; for optimization

package.json

@@ -2,14 +2,15 @@
   "name": "vue",
   "version": "2.0.8",
   "description": "Reactive, component-oriented view layer for modern web interfaces.",
-  "main": "dist/vue.common.js",
+  "main": "dist/vue.runtime.common.js",
   "typings": "types/index.d.ts",
   "files": [
-    "dist/vue.common.js",
-    "dist/vue.runtime.js",
-    "dist/vue.runtime.min.js",
     "dist/vue.js",
     "dist/vue.min.js",
+    "dist/vue.runtime.js",
+    "dist/vue.runtime.min.js",
+    "dist/vue.common.js",
+    "dist/vue.runtime.common.js",
     "src",
     "types/index.d.ts",
     "types/options.d.ts",
@@ -18,28 +19,28 @@
     "types/vue.d.ts"
   ],
   "scripts": {
-    "dev": "TARGET=web-standalone-dev rollup -w -c build/config.js",
-    "dev:runtime": "TARGET=web-runtime-dev rollup -w -c build/config.js",
+    "dev": "TARGET=web-full-dev rollup -w -c build/config.js",
+    "dev:cjs": "TARGET=web-runtime-cjs rollup -w -c build/config.js",
     "dev:test": "karma start build/karma.dev.config.js",
     "dev:ssr": "TARGET=web-server-renderer rollup -w -c build/config.js",
     "dev:compiler": "TARGET=web-compiler rollup -w -c build/config.js",
     "dev:weex": "TARGET=weex-framework rollup -w -c build/config.js",
     "dev:weex:compiler": "TARGET=weex-compiler rollup -w -c build/config.js",
     "build": "node build/build.js",
-    "build:ssr": "npm run build -- vue.common.js,vue-server-renderer",
+    "build:ssr": "npm run build -- vue.runtime.common.js,vue-server-renderer",
     "build:weex": "npm run build -- weex-vue-framework,weex-template-compiler",
     "test": "npm run lint && flow check && npm run test:types && npm run test:cover && npm run test:e2e -- --env phantomjs && npm run test:ssr",
     "test:unit": "karma start build/karma.unit.config.js",
     "test:cover": "karma start build/karma.cover.config.js",
     "test:e2e": "npm run build -- vue.min.js && node test/e2e/runner.js",
     "test:weex": "npm run build:weex && jasmine JASMINE_CONFIG_PATH=test/weex/jasmine.json",
-    "test:ssr": "npm run build:ssr && VUE_ENV=server jasmine JASMINE_CONFIG_PATH=test/ssr/jasmine.json",
+    "test:ssr": "npm run build:ssr && jasmine JASMINE_CONFIG_PATH=test/ssr/jasmine.json",
     "test:sauce": "npm run sauce -- 0 && npm run sauce -- 1 && npm run sauce -- 2",
     "test:types": "tsc -p ./types/test/tsconfig.json",
     "lint": "eslint src build test",
     "flow": "flow check",
     "sauce": "SAUCE=true karma start build/karma.sauce.config.js",
-    "bench:ssr": "npm run build:ssr && NODE_ENV=production VUE_ENV=server node benchmarks/ssr/renderToString.js && NODE_ENV=production VUE_ENV=server node benchmarks/ssr/renderToStream.js",
+    "bench:ssr": "npm run build:ssr && NODE_ENV=production node benchmarks/ssr/renderToString.js && NODE_ENV=production VUE_ENV=server node benchmarks/ssr/renderToStream.js",
     "release": "bash build/release.sh",
     "release:weex": "bash build/release-weex.sh"
   },

src/compiler/parser/index.js

@@ -4,6 +4,7 @@ import { decode } from 'he'
 import { parseHTML } from './html-parser'
 import { parseText } from './text-parser'
 import { cached, no, camelize } from 'shared/util'
+import { isIE, isServerRendering } from 'core/util/env'
 import {
   pluckModuleFunction,
   getAndRemoveAttr,
@@ -69,7 +70,7 @@ export function parse (
 
       // handle IE svg bug
       /* istanbul ignore if */
-      if (options.isIE && ns === 'svg') {
+      if (isIE && ns === 'svg') {
         attrs = guardIESVGBug(attrs)
       }
 
@@ -77,7 +78,7 @@ export function parse (
         type: 1,
         tag,
         attrsList: attrs,
-        attrsMap: makeAttrsMap(attrs, options.isIE),
+        attrsMap: makeAttrsMap(attrs),
         parent: currentParent,
         children: []
       }
@@ -85,7 +86,7 @@ export function parse (
         element.ns = ns
       }
 
-      if (process.env.VUE_ENV !== 'server' && isForbiddenTag(element)) {
+      if (isForbiddenTag(element) && !isServerRendering()) {
         element.forbidden = true
         process.env.NODE_ENV !== 'production' && warn(
           'Templates should only be responsible for mapping the state to the ' +
@@ -213,7 +214,7 @@ export function parse (
       }
       // IE textarea placeholder bug
       /* istanbul ignore if */
-      if (options.isIE &&
+      if (isIE &&
           currentParent.tag === 'textarea' &&
           currentParent.attrsMap.placeholder === text) {
         return
@@ -437,7 +438,7 @@ function parseModifiers (name: string): Object | void {
   }
 }
 
-function makeAttrsMap (attrs: Array<Object>, isIE: ?boolean): Object {
+function makeAttrsMap (attrs: Array<Object>): Object {
   const map = {}
   for (let i = 0, l = attrs.length; i < l; i++) {
     if (process.env.NODE_ENV !== 'production' && map[attrs[i].name] && !isIE) {

src/core/config.js

@@ -19,7 +19,6 @@ export type Config = {
   _assetTypes: Array<string>;
   _lifecycleHooks: Array<string>;
   _maxUpdateCount: number;
-  _isServer: boolean;
 }
 
 const config: Config = {
@@ -104,12 +103,7 @@ const config: Config = {
   /**
    * Max circular updates allowed in a scheduler flush cycle.
    */
-  _maxUpdateCount: 100,
-
-  /**
-   * Server rendering?
-   */
-  _isServer: process.env.VUE_ENV === 'server'
+  _maxUpdateCount: 100
 }
 
 export default config

src/core/index.js

@@ -1,11 +1,11 @@
-import config from './config'
-import { initGlobalAPI } from './global-api/index'
 import Vue from './instance/index'
+import { initGlobalAPI } from './global-api/index'
+import { isServerRendering } from 'core/util/env'
 
 initGlobalAPI(Vue)
 
 Object.defineProperty(Vue.prototype, '$isServer', {
-  get: () => config._isServer
+  get: isServerRendering
 })
 
 Vue.version = '2.0.8'

src/core/instance/render.js

@@ -4,7 +4,7 @@ import config from '../config'
 import VNode, { emptyVNode, cloneVNode, cloneVNodes } from '../vdom/vnode'
 import { normalizeChildren } from '../vdom/helpers/index'
 import {
-  warn, formatComponentName, bind, isObject, toObject,
+  warn, formatComponentName, bind, isObject, toObject, isServerRendering,
   nextTick, resolveAsset, _toString, toNumber, looseEqual, looseIndexOf
 } from '../util/index'
 
@@ -62,7 +62,7 @@ export function renderMixin (Vue: Class<Component>) {
       if (config.errorHandler) {
         config.errorHandler.call(null, e, vm)
       } else {
-        if (config._isServer) {
+        if (isServerRendering()) {
           throw e
         } else {
           console.error(e)

src/core/observer/index.js

@@ -1,6 +1,5 @@
 /* @flow */
 
-import config from '../config'
 import Dep from './dep'
 import { arrayMethods } from './array'
 import {
@@ -9,7 +8,8 @@ import {
   isPlainObject,
   hasProto,
   hasOwn,
-  warn
+  warn,
+  isServerRendering
 } from '../util/index'
 
 const arrayKeys = Object.getOwnPropertyNames(arrayMethods)
@@ -113,7 +113,7 @@ export function observe (value: any): Observer | void {
     ob = value.__ob__
   } else if (
     observerState.shouldConvert &&
-    !config._isServer &&
+    !isServerRendering() &&
     (Array.isArray(value) || isPlainObject(value)) &&
     Object.isExtensible(value) &&
     !value._isVue

src/core/util/env.js

@@ -18,6 +18,23 @@ export const isEdge = UA && UA.indexOf('edge/') > 0
 export const isAndroid = UA && UA.indexOf('android') > 0
 export const isIOS = UA && /iphone|ipad|ipod|ios/.test(UA)
 
+// this needs to be lazy-evaled because vue may be required before
+// vue-server-renderer can set VUE_ENV
+let _isServer
+export const isServerRendering = () => {
+  if (_isServer === undefined) {
+    /* istanbul ignore if */
+    if (!inBrowser && typeof global !== 'undefined') {
+      // detect presence of vue-server-renderer and avoid
+      // Webpack shimming the process
+      _isServer = global['process'].env.VUE_ENV === 'server'
+    } else {
+      _isServer = false
+    }
+  }
+  return _isServer
+}
+
 // detect devtools
 export const devtools = inBrowser && window.__VUE_DEVTOOLS_GLOBAL_HOOK__
 

src/entries/web-runtime.js

@@ -26,14 +26,14 @@ extend(Vue.options.directives, platformDirectives)
 extend(Vue.options.components, platformComponents)
 
 // install platform patch function
-Vue.prototype.__patch__ = config._isServer ? noop : patch
+Vue.prototype.__patch__ = inBrowser ? patch : noop
 
 // wrap mount
 Vue.prototype.$mount = function (
   el?: string | Element,
   hydrating?: boolean
 ): Component {
-  el = el && !config._isServer ? query(el) : undefined
+  el = el && inBrowser ? query(el) : undefined
   return this._mount(el, hydrating)
 }
 

src/entries/web-server-renderer.js

@@ -1,5 +1,7 @@
 /* @flow */
 
+process.env.VUE_ENV = 'server'
+
 import { createRenderer as _createRenderer } from 'server/create-renderer'
 import { createBundleRendererCreator } from 'server/create-bundle-renderer'
 import { isUnaryTag } from 'web/util/index'

src/platforms/web/compiler/index.js

@@ -1,7 +1,6 @@
 /* @flow */
 
 import { extend, genStaticKeys, noop } from 'shared/util'
-import { isIE } from 'core/util/env'
 import { warn } from 'core/util/debug'
 import { compile as baseCompile } from 'compiler/index'
 import { detectErrors } from 'compiler/error-detector'
@@ -15,7 +14,6 @@ import {
 const cache: { [key: string]: CompiledFunctionResult } = Object.create(null)
 
 export const baseOptions: CompilerOptions = {
-  isIE,
   expectHTML: true,
   modules,
   staticKeys: genStaticKeys(modules),

src/server/create-renderer.js

@@ -1,9 +1,8 @@
 /* @flow */
 
 import RenderStream from './render-stream'
-import { createRenderFunction } from './render'
-import { warn } from 'core/util/debug'
 import { createWriteFunction } from './write'
+import { createRenderFunction } from './render'
 
 export function createRenderer ({
   modules = [],
@@ -19,13 +18,6 @@ export function createRenderer ({
   renderToString: Function,
   renderToStream: Function
 } {
-  if (process.env.VUE_ENV !== 'server') {
-    warn(
-      'You are using createRenderer without setting VUE_ENV environment variable to "server". ' +
-      'It is recommended to set VUE_ENV=server this will help rendering performance, ' +
-      'by turning data observation off.'
-    )
-  }
   const render = createRenderFunction(modules, directives, isUnaryTag, cache)
 
   return {

src/server/render.js

@@ -262,6 +262,7 @@ export function createRenderFunction (
     write: (text: string, next: Function) => void,
     done: Function
   ) {
+    checkBuild(component)
     warned = Object.create(null)
     const context = {
       activeInstance: component,
@@ -276,3 +277,23 @@ export function createRenderFunction (
     renderNode(component._render(), true, context)
   }
 }
+
+function checkBuild (component) {
+  let Vue = component.constructor
+  while (Vue.super) {
+    Vue = Vue.super
+  }
+  if (Vue.compile) {
+    console.error(
+      red(`\n[vue-server-renderer] You are using the standalone build (vue/dist/vue.js) for ` +
+      `server-side rendering. It is recommended to use the CommonJS build ` +
+      `(vue/dist/vue.common.js) instead so that the code can run in ` +
+      `production mode by setting NODE_ENV=production. The server renderer ` +
+      `supports the template option regardless of what build you are using.\n`)
+    )
+  }
+}
+
+function red (str) {
+  return '\u001B[1m\u001B[31m' + str + '\u001B[39m\u001B[22m'
+}

test/ssr/fixtures/app.js

@@ -1,4 +1,4 @@
-import Vue from '../../../dist/vue.common.js'
+import Vue from '../../../dist/vue.runtime.common.js'
 
 export default context => {
   return new Promise(resolve => {

test/ssr/fixtures/cache.js

@@ -1,4 +1,4 @@
-import Vue from '../../../dist/vue.common.js'
+import Vue from '../../../dist/vue.runtime.common.js'
 
 const app = {
   name: 'app',

test/ssr/ssr-env.spec.js

@@ -1,45 +0,0 @@
-import Vue from '../../dist/vue.common.js'
-import { createRenderer } from '../../packages/vue-server-renderer'
-import '../helpers/to-have-been-warned.js'
-
-describe('SSR: VUE_ENV=server', () => {
-  it('_isServer set as "server" on Vue config', () => {
-    expect(Vue.config._isServer).toBe(true)
-  })
-
-  it('$isServer set as true on VM', () => {
-    const vm = new Vue({
-      data: {
-        foo: 'server',
-        bar: 'rendering'
-      }
-    })
-    expect(vm.$isServer).toBe(true)
-  })
-
-  it('no data observations', () => {
-    const vm = new Vue({
-      data: {
-        foo: 'server',
-        bar: 'rendering'
-      },
-      computed: {
-        combined () {
-          return this.foo + this.bar
-        }
-      }
-    })
-
-    vm.foo = ''
-    expect(vm.foo).toBe('')
-    expect(vm.combined).toBe('rendering')
-    expect(vm.$data.__ob__).toBe(undefined)
-  })
-
-  it('should warn when not set', () => {
-    process.env.VUE_ENV = ''
-    createRenderer()
-    expect('You are using createRenderer without setting VUE_ENV environment').toHaveBeenWarned()
-    process.env.VUE_ENV = 'server'
-  })
-})

test/ssr/ssr-stream.spec.js

@@ -1,4 +1,4 @@
-import Vue from '../../dist/vue.common.js'
+import Vue from '../../dist/vue.runtime.common.js'
 import { createRenderer } from '../../packages/vue-server-renderer'
 const { renderToStream } = createRenderer()
 
@@ -65,6 +65,7 @@ describe('SSR: renderToStream', () => {
   })
 
   it('should catch error', done => {
+    Vue.config.silent = true
     const stream = renderToStream(new Vue({
       render () {
         throw new Error('oops')
@@ -72,6 +73,7 @@ describe('SSR: renderToStream', () => {
     }))
     stream.on('error', err => {
       expect(err.toString()).toMatch(/oops/)
+      Vue.config.silent = false
       done()
     })
     stream.on('data', _ => _)

test/ssr/ssr-string.spec.js

@@ -1,4 +1,4 @@
-import Vue from '../../dist/vue.common.js'
+import Vue from '../../dist/vue.runtime.common.js'
 import { createRenderer } from '../../packages/vue-server-renderer'
 const { renderToString } = createRenderer()
 
@@ -663,12 +663,14 @@ describe('SSR: renderToString', () => {
   })
 
   it('should catch error', done => {
+    Vue.config.silent = true
     renderToString(new Vue({
       render () {
         throw new Error('oops')
       }
     }), err => {
       expect(err instanceof Error).toBe(true)
+      Vue.config.silent = false
       done()
     })
   })

test/unit/features/instance/properties.spec.js

@@ -79,12 +79,4 @@ describe('Instance properties', () => {
     }).$mount()
     expect(calls).toEqual(['outer:undefined', 'middle:outer', 'inner:middle', 'next:undefined'])
   })
-
-  it('$isServer', () => {
-    const vm = new Vue()
-    expect(vm.$isServer).toBe(false)
-    Vue.config._isServer = true
-    expect(vm.$isServer).toBe(true)
-    Vue.config._isServer = false
-  })
 })