Browse Source

chore: webpack打包优化

master
iapyang 5 years ago
parent
commit
0ea168688c
  1. 48
      lib/postbuild/postbuild.js
  2. 18
      webpack/attachments.js
  3. 7
      webpack/dirs.js
  4. 46
      webpack/webpack.common.js
  5. 16
      webpack/webpack.prod.js

48
lib/postbuild/postbuild.js

@ -1,5 +1,5 @@
const { resolve } = require("path"); const { resolve } = require("path");
const { copyFileSync, existsSync, mkdirSync, readFileSync, writeFileSync } = require("fs"); const { existsSync, mkdirSync, readFileSync, writeFileSync } = require("fs");
const rimraf = require("rimraf"); const rimraf = require("rimraf");
const dest = resolve(__dirname, '../../dist'); const dest = resolve(__dirname, '../../dist');
@ -11,49 +11,15 @@ if (!existsSync($dest)) {
} }
const deleteList = [ const deleteList = [
"bundle.ie.css", "fineui.ie.min.css",
"bundle_without_normalize.js",
"bundle_without_normalize.js.map",
"fineui.ie.css",
"fineui_without_jquery_polyfill.css", "fineui_without_jquery_polyfill.css",
"font.js",
"font.js.map",
"2.0/fineui.ie.min.css",
"2.0/fineui_without_normalize.js",
"2.0/fineui_without_normalize.js.map",
]; ];
const copyList = [{
source: "bundle.min",
exts: ["css", "js", "js.map"],
targets: ["2.0/fineui", "2.0/fineui.min"],
}, {
source: "bundle_without_normalize",
exts: ["css"],
targets: ["2.0/fineui_without_normalize", "2.0/fineui_without_normalize.min"],
}, {
source: "fineui",
exts: ["css", "js", "js.map"],
targets: ["fineui.min"],
}, {
source: "utils",
exts: ["js", "js.map"],
targets: ["utils.min"],
}, {
source: "bundle.ie",
exts: ["js", "js.map"],
targets: ["2.0/fineui.ie", "2.0/fineui.ie.min"],
}];
copyList.forEach(conf => {
conf.exts.forEach(ext => {
const sourcefile = resolve(dest, `./${conf.source}.${ext}`);
if (!existsSync(sourcefile)) {
console.log(`${sourcefile} does not exist!`);
}
conf.targets.forEach(target => {
copyFileSync(sourcefile, resolve(dest, `./${target}.${ext}`));
});
});
});
deleteList.forEach(filename => { deleteList.forEach(filename => {
const sourcefile = resolve(dest, `./${filename}`); const sourcefile = resolve(dest, `./${filename}`);

18
webpack/attachments.js

@ -8,6 +8,10 @@ function sync(patterns) {
return uniq(grunt.file.expand({ filter: path => !new RegExp(/__test__/g).test(path) }, patterns)).map(name => `./${name}`); return uniq(grunt.file.expand({ filter: path => !new RegExp(/__test__/g).test(path) }, patterns)).map(name => `./${name}`);
} }
const fixJs = "./dist/fix/fix.js";
const fixIEJs = "./dist/fix/fix.ie.js";
const lodashJs = "src/core/lodash.js";
const basicAttachmentMap = { const basicAttachmentMap = {
polyfill: sync(["src/core/foundation.js", "src/polyfill/**/*.js"]).concat(["@babel/polyfill", "es6-promise/auto"]), polyfill: sync(["src/core/foundation.js", "src/polyfill/**/*.js"]).concat(["@babel/polyfill", "es6-promise/auto"]),
polyfillIE: sync(["src/core/foundation.js", "src/polyfill/**/*.js"]).concat([ polyfillIE: sync(["src/core/foundation.js", "src/polyfill/**/*.js"]).concat([
@ -28,7 +32,7 @@ const basicAttachmentMap = {
"src/less/core/**/*.less", "src/less/core/**/*.less",
"src/less/theme/**/*.less", "src/less/theme/**/*.less",
"src/core/foundation.js", "src/core/foundation.js",
"src/core/lodash.js", lodashJs,
// 'src/core/mvc/**/*.js', // 'src/core/mvc/**/*.js',
"src/core/base.js", "src/core/base.js",
"src/core/ob.js", "src/core/ob.js",
@ -87,7 +91,7 @@ const basicAttachmentMap = {
config: sync(["demo/version.js", "i18n/i18n.cn.js"]), config: sync(["demo/version.js", "i18n/i18n.cn.js"]),
utils: sync([ utils: sync([
"src/core/foundation.js", "src/core/foundation.js",
"src/core/lodash.js", lodashJs,
"src/core/var.js", "src/core/var.js",
"src/core/func/array.js", "src/core/func/array.js",
"src/core/func/number.js", "src/core/func/number.js",
@ -105,8 +109,8 @@ const basicAttachmentMap = {
"src/data/data.js", "src/data/data.js",
"src/data/**/*.js", "src/data/**/*.js",
]), ]),
fix: ['./typescript/fix/fix.ts'], fix: [fixJs],
fixIE: ['./typescript/fix/fix.ie.ts'], fixIE: [fixIEJs],
}; };
const bundle = [].concat( const bundle = [].concat(
@ -177,7 +181,7 @@ const fineuiIE = [].concat(
const fineuiWithoutJqueryAndPolyfillJs = [].concat( const fineuiWithoutJqueryAndPolyfillJs = [].concat(
sync([ sync([
"src/core/foundation.js", "src/core/foundation.js",
"src/core/lodash.js", lodashJs,
// 'src/core/mvc/**/*.js', // 'src/core/mvc/**/*.js',
"src/core/base.js", "src/core/base.js",
"src/core/ob.js", "src/core/ob.js",
@ -232,6 +236,10 @@ const demo = [].concat(
); );
module.exports = { module.exports = {
fix: fixJs,
fixIE: fixIEJs,
lodash: lodashJs,
font: basicAttachmentMap.font,
bundle: uniq(bundle), bundle: uniq(bundle),
bundleIE: uniq(bundleIE), bundleIE: uniq(bundleIE),
bundleWithoutNormalize: uniq(bundleWithoutNormalize), bundleWithoutNormalize: uniq(bundleWithoutNormalize),

7
webpack/dirs.js

@ -6,4 +6,11 @@ module.exports = {
BABEL_CONFIG: path.resolve(__dirname, "../babel.config.js"), BABEL_CONFIG: path.resolve(__dirname, "../babel.config.js"),
IE8_BABEL_CONFIG: path.resolve(__dirname, "../babel.config.ie8.js"), IE8_BABEL_CONFIG: path.resolve(__dirname, "../babel.config.ie8.js"),
TYPESCRIPT: path.resolve(__dirname, "../typescript"), TYPESCRIPT: path.resolve(__dirname, "../typescript"),
SRC: path.resolve(__dirname, "../src"),
DEMO: path.resolve(__dirname, "../demo"),
PUBLIC: path.resolve(__dirname, "../public"),
I18N: path.resolve(__dirname, "../i18n"),
UI: path.resolve(__dirname, "../ui"),
MOBILE: path.resolve(__dirname, "../_mobile"),
FIX: path.resolve(__dirname, "../dist/fix"),
}; };

46
webpack/webpack.common.js

@ -1,5 +1,6 @@
const MiniCssExtractPlugin = require("mini-css-extract-plugin"); const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const autoprefixer = require("autoprefixer"); const autoprefixer = require("autoprefixer");
const path = require("path");
const dirs = require("./dirs"); const dirs = require("./dirs");
@ -22,7 +23,7 @@ module.exports = {
{ {
test: /\.(js|ts)$/, test: /\.(js|ts)$/,
include: [dirs.NODE_MODULES, dirs.PRIVATE, dirs.TYPESCRIPT], include: [dirs.NODE_MODULES, dirs.PRIVATE, dirs.TYPESCRIPT],
exclude: /(node_modules(\/|\\)core-js|\.\/demo|\.\/src|\.\/public|\.\/i18n|\.\/ui|\.\/_mobile|\.dist).+\.js$/, exclude: /node_modules(\/|\\)core-js/,
use: [{ use: [{
loader: "babel-loader", loader: "babel-loader",
options: { options: {
@ -35,6 +36,49 @@ module.exports = {
}, },
}], }],
}, },
{
test: /\.js$/,
include: [
dirs.DEMO,
dirs.SRC,
dirs.PUBLIC,
dirs.MOBILE,
dirs.I18N,
dirs.UI,
dirs.FIX,
],
use: [
{
loader: "source-map-loader",
options: {
enforce: "pre",
},
},
],
},
{
test: /\.js$/,
include: [path.resolve(__dirname, '../', attachments.lodash)],
use: [
{
loader: "script-loader",
},
],
},
{
test: path.resolve(__dirname, '../', attachments.fix),
use: [{
loader: 'expose-loader',
options: 'Fix',
}],
},
{
test: path.resolve(__dirname, '../', attachments.fixIE),
use: [{
loader: 'expose-loader',
options: 'Fix',
}],
},
{ {
test: /\.(css|less)$/, test: /\.(css|less)$/,
use: [ use: [

16
webpack/webpack.prod.js

@ -14,17 +14,23 @@ const attachments = require("./attachments");
module.exports = merge.smart(common, { module.exports = merge.smart(common, {
mode: "production", mode: "production",
entry: { entry: {
'bundle.min': attachments.bundle, font: attachments.font,
'bundle_without_normalize': attachments.bundleWithoutNormalize,
fineui: attachments.fineui, fineui: attachments.fineui,
'fineui_without_jquery_polyfill': attachments.fineuiWithoutJqueryAndPolyfillJs, "fineui.min": attachments.fineui,
"fineui.ie.min": attachments.fineuiIE,
utils: attachments.utils, utils: attachments.utils,
'bundle.ie': attachments.bundleIE, "utils.min": attachments.utils,
'fineui.ie': attachments.fineuiIE, "bundle.min": attachments.bundle,
"fineui_without_jquery_polyfill": attachments.fineuiWithoutJqueryAndPolyfillJs,
"2.0/fineui.ie.min": attachments.bundleIE,
"2.0/fineui": attachments.bundle,
"2.0/fineui.min": attachments.bundle,
'2.0/fineui_without_normalize': attachments.bundleWithoutNormalize,
}, },
optimization: { optimization: {
minimizer: [ minimizer: [
new UglifyJsPlugin({ new UglifyJsPlugin({
include: /\.min/,
parallel: true, parallel: true,
sourceMap: true, sourceMap: true,
uglifyOptions: { uglifyOptions: {

Loading…
Cancel
Save