自动化构建项目中的文件操作

读写文件

fs; path

var fs = require('fs');
var path = require('path');
//__dirname:全局变量，存储的是文件所在的文件目录
//path.resolve:把一个路径或路径片段的序列解析为一个绝对路径。
//读文件
var readFile = fs.readFileSync(path.resolve(__dirname, '../../src/test.js'), 'utf8');
var jsonObject=JSON.parse(readFile);
//写文件
fs.writeFile(path.resolve(__dirname, '../../dist/dist.js'), JSON.stringify(jsonObject));

通过postcss解析文件

postcss

var postcss = require('postcss');
var fs = require('fs');
var path = require('path');
var fontFile = fs.readFileSync(path.resolve(__dirname, '../../packages/theme-chalk/src/icon.scss'), 'utf8');
var nodes = postcss.parse(fontFile).nodes;
var classList = [];

nodes.forEach((node) => {
  var selector = node.selector || '';
  var reg = new RegExp(/\.el-icon-([^:]+):before/);
  var arr = selector.match(reg);

  if (arr && arr[1]) {
    classList.push(arr[1]);
  }
});

fs.writeFile(path.resolve(__dirname, '../../examples/icon.json'), JSON.stringify(classList));

使用json-templater和uppercamelcase做模板字符替换和驼峰规范

uppercamelcase使用实例

const upperCamelCase = require('uppercamelcase');
 
upperCamelCase('foo-bar');
//=> FooBar 
 
upperCamelCase('foo_bar');
//=> FooBar 
 
upperCamelCase('Foo-Bar');
//=> FooBar 
 
upperCamelCase('--foo.bar');
//=> FooBar 
 
upperCamelCase('__foo__bar__');
//=> FooBar 
 
upperCamelCase('foo bar');
//=> FooBar 
 
console.log(process.argv[3]);
//=> --foo-bar 
upperCamelCase(process.argv[3]);
//=> FooBar 
 
upperCamelCase('foo', 'bar');
//=> 'FooBar' 
 
upperCamelCase('__foo__', '--bar');
//=> 'FooBar' 

json-templater和uppercamelcase组合使用实例

var Components = require('../../components.json');
var fs = require('fs');
var render = require('json-templater/string');
var uppercamelcase = require('uppercamelcase');
var path = require('path');
/**一个字符串常量,定义操作系统相关的行末标志:

\n 在 POSIX 系统上
\r\n 在 Windows系统上
**/
var endOfLine = require('os').EOL;

var OUTPUT_PATH = path.join(__dirname, '../../src/index.js');
var IMPORT_TEMPLATE = 'import {{name}} from \'../packages/{{package}}/index.js\';';
var INSTALL_COMPONENT_TEMPLATE = '  {{name}}';
var MAIN_TEMPLATE = `/* Automatically generated by './build/bin/build-entry.js' */

{{include}}
import locale from 'element-ui/src/locale';
import CollapseTransition from 'element-ui/src/transitions/collapse-transition';

const components = [
{{install}},
  CollapseTransition
];

const install = function(Vue, opts = {}) {
  locale.use(opts.locale);
  locale.i18n(opts.i18n);

  components.map(component => {
    Vue.component(component.name, component);
  });

  Vue.use(Loading.directive);

  const ELEMENT = {};
  ELEMENT.size = opts.size || '';

  Vue.prototype.$loading = Loading.service;
  Vue.prototype.$msgbox = MessageBox;
  Vue.prototype.$alert = MessageBox.alert;
  Vue.prototype.$confirm = MessageBox.confirm;
  Vue.prototype.$prompt = MessageBox.prompt;
  Vue.prototype.$notify = Notification;
  Vue.prototype.$message = Message;

  Vue.prototype.$ELEMENT = ELEMENT;
};

/* istanbul ignore if */
if (typeof window !== 'undefined' && window.Vue) {
  install(window.Vue);
};

module.exports = {
  version: '{{version}}',
  locale: locale.use,
  i18n: locale.i18n,
  install,
  CollapseTransition,
  Loading,
{{list}}
};

module.exports.default = module.exports;
`;

delete Components.font;

var ComponentNames = Object.keys(Components);

var includeComponentTemplate = [];
var installTemplate = [];
var listTemplate = [];

ComponentNames.forEach(name => {
  var componentName = uppercamelcase(name);

  includeComponentTemplate.push(render(IMPORT_TEMPLATE, {
    name: componentName,
    package: name
  }));

  if (['Loading', 'MessageBox', 'Notification', 'Message'].indexOf(componentName) === -1) {
    installTemplate.push(render(INSTALL_COMPONENT_TEMPLATE, {
      name: componentName,
      component: name
    }));
  }

  if (componentName !== 'Loading') listTemplate.push(`  ${componentName}`);
});

var template = render(MAIN_TEMPLATE, {
  include: includeComponentTemplate.join(endOfLine),
  install: installTemplate.join(',' + endOfLine),
  version: process.env.VERSION || require('../../package.json').version,
  list: listTemplate.join(',' + endOfLine)
});

fs.writeFileSync(OUTPUT_PATH, template);
console.log('[build entry] DONE:', OUTPUT_PATH);