switch to webpack build

Author: yyx990803

grunt/shared-build.js

@@ -2,67 +2,27 @@
  * Shared build function
  */
 
-var resolve = require('component-resolver')
-var build = require('component-builder')
-
 module.exports = function (grunt, cb) {
 
-  var license =
+  var webpack = require('webpack')
+  var banner =
     '/**\n' +
     ' * Vue.js v' + grunt.config.get('version') + '\n' +
     ' * (c) ' + new Date().getFullYear() + ' Evan You\n' +
     ' * Released under the MIT License.\n' +
     ' */\n'
 
-  // build with component-builder
-  resolve(process.cwd(), {}, function (err, tree) {
-    build.scripts(tree)
-      .use('scripts', build.plugins.js())
-      .end(function (err, js) {
-        // wrap with umd
-        js = umd(js)
-        // replace require paths with numbers for file size
-        js = shortenPaths(js)
-        // add license
-        js = license + js
-        // done
-        cb(js)
-      })
-  })
-}
-
-/**
- * component's umd wrapper throws error in strict mode
- * so we have to roll our own
- */
-
-function umd (js) {
-  return '\n;(function(){\n\n'
-    + '"use strict"\n\n'
-    + build.scripts.require
-    + js
-    + 'if (typeof exports == "object") {\n'
-    + '  module.exports = require("vue");\n'
-    + '} else if (typeof define == "function" && define.amd) {\n'
-    +'  define([], function(){ return require("vue"); });\n'
-    + '} else {\n'
-    + '  window.Vue = require("vue");\n'
-    + '}\n'
-    + '})()\n';
-}
-
-/**
- * Shorten require() paths for smaller file size
- */
+  webpack({
+    entry: './src/vue',
+    output: {
+      path: './dist',
+      filename: 'vue.js',
+      library: 'Vue',
+      libraryTarget: 'umd'
+    },
+    plugins: [
+      new webpack.BannerPlugin(banner, { raw: true })
+    ]
+  }, cb)
 
-function shortenPaths (js) {
-  var seen = {}
-  var count = 0
-  return js.replace(/'vue\/src\/(.+?)'|"vue\/src\/(.+?)"/g, function (path) {
-    path = path.slice(1, -1)
-    if (!seen[path]) {
-      seen[path] = ++count
-    }
-    return seen[path]
-  })
 }

grunt/tasks/build-test.js

@@ -1,15 +1,21 @@
+/**
+ * Build `test/unit/specs.js` which is used in
+ * `test/unit/runner.html`
+ */
+
 module.exports = function (grunt) {
   grunt.registerTask('build-test', function () {
-    var done = this.async()
-    var fs = require('fs')
-    var browserify = require('browserify')
+    var webpack = require('webpack')
     var files = grunt.file.expand(['test/unit/specs/**/*.js'])
       .map(function (file) {
         return './' + file
       })
-    browserify(files)
-      .bundle()
-      .pipe(fs.createWriteStream('test/unit/specs.js'))
-      .on('close', done)
+    webpack({
+      entry: files,
+      output: {
+        path: './test/unit',
+        filename: 'specs.js'
+      }
+    }, this.async())
   })
 }

grunt/tasks/build.js

@@ -1,3 +1,7 @@
+/**
+ * Build, update component.json, uglify, and report size.
+ */
+
 module.exports = function (grunt) {
   grunt.registerTask('build', function () {
 
@@ -19,8 +23,10 @@ module.exports = function (grunt) {
     grunt.file.write('component.json', JSON.stringify(component, null, 2))
 
     // then build
-    build(grunt, function (js) {
-      write('dist/vue.js', js)
+    build(grunt, function (err) {
+      if (err) return done(err)
+      var js = fs.readFileSync('dist/vue.js', 'utf-8')
+      report('dist/vue.js', js)
       // uglify
       var result = uglifyjs.minify(js, {
         fromString: true,
@@ -42,12 +48,16 @@ module.exports = function (grunt) {
       // report gzip size
       zlib.gzip(result.code, function (err, buf) {
         write('dist/vue.min.js.gz', buf)
-        done()
+        done(err)
       })
     })
 
-    function write (path, file, report) {
+    function write (path, file) {
       fs.writeFileSync(path, file)
+      report(path, file)
+    }
+
+    function report (path, file) {
       console.log(
         blue(path + ': ') +
         (file.length / 1024).toFixed(2) + 'kb'

grunt/tasks/casper.js

@@ -1,7 +1,10 @@
-var path = require('path')
+/**
+ * Run e2e tests with CasperJS.
+ */
 
 module.exports = function (grunt) {
   grunt.registerTask( 'casper', function (id) {
+    var path = require('path')
     var done = this.async()
     var file = id ? id + '.js' : ''
     grunt.util.spawn({

grunt/tasks/dev.js

@@ -1,11 +1,9 @@
+/**
+ * Simple development build to be run with grunt watch.
+ */
+
 module.exports = function (grunt) {
   grunt.registerTask('dev', function () {
-    var done = this.async()
-    var fs = require('fs')
-    var build = require('../shared-build')
-    build(grunt, function (js) {
-      fs.writeFileSync('dist/vue.js', js)
-      done()
-    })
+    require('../shared-build')(grunt, this.async())
   })
 }

package.json

@@ -20,9 +20,6 @@
     "test": "grunt ci"
   },
   "devDependencies": {
-    "browserify": "^5.11.0",
-    "component-builder": "^1.1.10",
-    "component-resolver": "^1.1.8",
     "grunt": "^0.4.5",
     "grunt-contrib-jshint": "^0.10.0",
     "grunt-contrib-watch": "^0.6.1",
@@ -37,6 +34,7 @@
     "karma-jasmine": "^0.2.2",
     "karma-phantomjs-launcher": "^0.1.4",
     "karma-sauce-launcher": "^0.2.10",
-    "uglify-js": "^2.4.15"
+    "uglify-js": "^2.4.15",
+    "webpack": "^1.4.4"
   }
 }