const fs = require('fs'); const path = require('path'); const webpack = require('webpack'); const webpackDevServer = require('webpack-dev-server'); const webpackBaseConfig = require('./webpack.base.config'); const webpackDllConfig = require('./webpack.dll.config'); const getEntry = require('./getEntry'); const config = require('../new-config.json'); const dependjsConf = require('../dependjs.json'); Object.assign(config, dependjsConf); // 在编译之后打印文字的webpack插件 const LogAfterCompilePlugin = require('./LogAfterCompilePlugin'); const CreateHtmlPlugin = require('./create-html-webpack-plugin/CreateHtmlPlugin'); // 工具集 const h = require('./hammer'); // 入口对象集 let entryTmp = getEntry(); let libEntryTmp = getEntry('lib'); // 取出js入口路径 let entries = entryTmp.entry; let libEntries = libEntryTmp.entry; // 取出模版路径 let entryTmpMap = entryTmp.template; let libEntryTmpMap = libEntryTmp.template; // 目标路径 let targetPath = webpackBaseConfig.output.path // 定义项目路径 let projectPath = path.join(__dirname, '../'); // 根据模版路径文件,取出模版 let templateMap = getTemplate(entryTmpMap); module.exports = (m) => { copyDir(); if (config['dll-entry'] && config['dll-entry'].length > 0) { runDllCompile() .then(() => { let manifestPath = getManifestPath(); webpackBaseConfig.plugins.unshift( new webpack.DllReferencePlugin({ manifest: require(manifestPath) }) ) runCompile(m); }); } else { runCompile(m); } } // 获取模板内容并且拼装模板 function getTemplate(templateMap) { let templateContentMap = {}; templateContentMap['default'] = path.join(projectPath, config['default-template']) Object.keys(templateMap).map((item) => { let templatePath = templateMap[item]; templateContentMap[item] = path.join(projectPath, templatePath) }); return templateContentMap } // 获取dll生成得manifest文件 function getManifestPath() { let outputPath = webpackDllConfig.output.path; let fileList = fs.readdirSync(outputPath); let manifestPath = '../dist/hrpub/dll/vendor-manifest.json'; for (let filename of fileList) { if (path.extname(filename) === '.json') { manifestPath = path.join(outputPath, filename); break; } } return manifestPath; } // 运行dll编译 function runDllCompile() { webpackDllConfig.plugins.push(new LogAfterCompilePlugin({ word: 'note: dll has compiled' })); return new Promise((resolve, reject) => { webpack(webpackDllConfig, (err) => { if (err) { console.log(err); } resolve(); }); }); } // 执行编译 function runCompile(m = []) { let pageCompiler = null; let nEntries = {}; let reg = new RegExp(m.join('|')); let externals = {}; /*let configjs = ''; //额外配置的js文件 let configcss = ''; //额外配置的css文件*/ Object.keys(entries).map((item) => { if (reg.test(item) || m.length === 0) { nEntries[item] = entries[item]; } }); // dependModuleName: 依赖的模块名 // dependjs: 依赖的js文件配置 /*if (Array.isArray(config.dependjs)) { configjs += config.dependjs.map(src => { let moduleName = /(?:\.\.\/)*([^\.]*)\.js/.exec(src); if (moduleName && moduleName[1]) { externals[moduleName[1]] = moduleName[1]; } return ``; }).join(''); }*/ // dependModuleName: 依赖的模块名 if (Array.isArray(config.dependModuleName)) { // 打包时排除 config.dependModuleName.forEach(item => (externals[`${item}`] = `${item}/index`)); } // dependcss: 依赖的css文件配置 /*if (Array.isArray(config.dependcss)) { configcss += config.dependcss .map(item => ``) .join(''); }*/ entries = nEntries; let pageWBC = { ...webpackBaseConfig, plugins: [...webpackBaseConfig.plugins], entry: entries, externals: { ...webpackBaseConfig.externals, ...externals } }; pageWBC.plugins.push(new CreateHtmlPlugin({ templateMap: templateMap, beforeAppendCss: ($, filePath = "") => { // 为了去掉平台对于console的影响 /*$('head').prepend(` `);*/ let configcss = getConfigCss(filePath.substr(0, filePath.length - 5)); $('head').prepend(configcss) }, beforeAppendJs: ($, filePath = "") => { if (config['dll-entry'] && config['dll-entry'].length > 0) { $('body').append(``); } /*$('body').append(` `);*/ let configjs = getConfigJs(filePath.substr(0, filePath.length - 5)); $('body').append(configjs); } })); /*Object.keys(entries).map((key) => { let htmlWebpackOption = { filename: `${key}.html`, template: path.join(projectPath, config['default-template']), chunks: [key], inject: true, templateParameters: { buildInfo: '', configjs: configjs, //为模板添加js configcss: configcss //为模板添加css } }; if (entryTmpMap[key]) { htmlWebpackOption.template = path.join(projectPath, entryTmpMap[key]); } pageWBC.plugins.push(new HtmlWebpackPlugin(htmlWebpackOption)); });*/ pageWBC.plugins.push(new LogAfterCompilePlugin()); pageCompiler = webpack(pageWBC); let libCompiler = webpack({ ...webpackBaseConfig, entry: libEntries }); libCompiler.run(function (err, stat) { if (err) { console.log(err); } let server = new webpackDevServer(pageCompiler, { contentBase: path.join(__dirname, '../dist'), proxy: config.proxy, stats: 'errors-only', inline: config['dev-server']['refresh-immediately'] }); server.listen(3006, '', () => { console.log('open localhost:3006'); }); }); } // 执行文件复制 function copyDir() { if (!h.isFileExist(targetPath)) { fs.mkdirSync(targetPath); } config.copy.map((obj) => { let absFrom = path.join(projectPath, obj.from); let absTo = path.join(targetPath, obj.to); if (!h.isFileExist(absTo)) { h.copyDirSync(targetPath, absFrom, absTo); } }); } /* * 引用js优化,如果需要只在特定的html中引入uap的js,可以放开这里的代码 * */ function getConfigJs(filePath) { // dependjs: 依赖的js文件配置 let configjs = ''; if (config.dependjs && Array.isArray(config.dependjs[filePath])) { config.dependjs[filePath].forEach(file => { configjs += ``; }) } if (Array.isArray(config.report) && config.report.includes(filePath)) { configjs += ``; configjs += ``; } if (Array.isArray(config.wpsconfig) && config.wpsconfig.includes(filePath)) { configjs += ``; } return configjs; } function getConfigCss(filePath) { // dependcss: 依赖的css文件配置 let configcss = ''; if (Array.isArray(config.dependcss)) { configcss += config.dependcss .map(item => ``) .join(''); } if (Array.isArray(config.report) && config.report.includes(filePath)) { configcss += ``; configcss += ``; } return configcss; }