vue源码阅读记录---rollup配置文件细读

在vue源码的script/script.js 定义了rollup打包的配置文件 ：

1 这一部分引入了一些依赖

const path = require('path')    //  path 模块提供了一些用于处理文件路径的小工具
const buble = require('rollup-plugin-bable') //rollup.js打包的过程中进行代码编译，将ES6+代码编译成ES2015标准
const alias = require('rollup-plugin-alias') // alias插件提供了为模块起别名的功能
const cjs = require('rollup-plugin-commonjs') //支持CommonJS模块
const replace = require('rollup-plugin-replace')   //replace插件的用途是在打包时动态替换代码中的内容
const node = require('rollup-plugin-node-resolve') //合并外部模块代码 for using third party modules in 
const flow = require('rollup-plugin-flow-no-whitespace') //flow插件用于在rollup.js打包过程中清除flow类型检查部分的代码
const version = process.env.VERSION || require('../package.json').version // 环境信息包含的版本信息或者package.json中定义的版本号
const weexVersion = process.env.WEEX_VERSION || require('../packages/weex-vue-framework/package.json').version //weex是阿里开发的跨平台移动开发工具
const featureFlags = require('./feature-flags')

import { terser } from ‘rollup-plugin-terser’ terser打包压缩
process.env 其中process是node的一个全局变量，提供有关信息，控制当前 Node.js 进程； process.env属性返回一个包含用户环境信息的对象。

feature-flag 定义了一个对象

module.exports = {
  NEW_SLOT_SYNTAX: true,
  VBIND_PROP_SHORTHAND: false
}

不懂weex 相关代码掠过

if (process.env.TARGET) {
  module.exports = genConfig(process.env.TARGET)
} else {
  exports.getBuild = genConfig
  exports.getAllBuilds = () => Object.keys(builds).map(genConfig)
}

如果 pricess.env.Targe存在 在执行 npm run dev时 为web-full-dev
然后看 getConfig(‘web-full-dev’)

function genConfig (name) {
  const opts = builds[name]   //在变量builds找到 web-full-web 
  const config = {
    input: opts.entry,  // resolve('web/entry-runtime-with-compiler.js'),
    external: opts.external, 
    plugins: [
      flow(),  
      alias(Object.assign({}, aliases, opts.alias)) //Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。
    ].concat(opts.plugins || []), //合并plugins
    output: {
      file: opts.dest, //resolve('dist/vue.js')
      format: opts.format, // format: 'umd',
      banner: opts.banner, //banner
      name: opts.moduleName || 'Vue'
    },
    onwarn: (msg, warn) => {
      if (!/Circular/.test(msg)) {
        warn(msg)
      }
    }
  }

  // built-in vars
  const vars = {
    __WEEX__: !!opts.weex,
    __WEEX_VERSION__: weexVersion,
    __VERSION__: version
  }
  // feature flags
  // 给上面定义的vars 添加process.env对象的属性
  Object.keys(featureFlags).forEach(key => {
    vars[`process.env.${key}`] = featureFlags[key]
  })
  // build-specific env
  //  env: 'development',
  if (opts.env) {
    vars['process.env.NODE_ENV'] = JSON.stringify(opts.env)
  }
  config.plugins.push(replace(vars))
  if (opts.transpile !== false) {
    config.plugins.push(buble())
  }

  Object.defineProperty(config, '_name', {
    enumerable: false,
    value: name
  })

  return config
}

整理config为

var config =
 {
 input: 'resolve('web/entry-runtime-with-compiler.js')',
 external: false,
 plugins：[
	flow(),
	aliss: ({
	}),
	replace({
		__WEEX__: !!opts.weex,
	   __WEEX_VERSION__: weexVersion,
       __VERSION__: version
       NEW_SLOT_SYNTAX: true,
       VBIND_PROP_SHORTHAND: false
      process.env.NODE_ENV: development
	}),
	buble()
	],
	output: {
	      file: resolve('dist/vue.js')
	      format:  'umd',
	      banner: banner
	      name: 'Vue'
	}
}