the configuration is as follows:
const webpack = require ("webpack")
const path = require (" path")
const fs = require ("fs")
const chalk = require (" chalk")
const HtmlWebpackPlugin = require ("html-webpack-plugin")
const WebpackMd5Hash = require (" webpack-md5-hash") / / md5 to be done
const HashedModuleIdsPlugin = require (". / HashedModuleIdsPlugin") / md5 to be done
const traverseFile = require (". / tools") ". / modulesCfg")
} catch (e) {
console.log (chalk.red ("= n modulesCfg.js, not found Please refer to README.md for configuration .nn ="));
}
/ / set the port number of the system environment
process.env.port = modulesCfg.localPORT
const NODE_ENV = process.env.NODE_ENV | | "develop" / / environment original value
const webpackConfig = {
/ / devtool:" source-map",
entry: {},
//
// [name] entrykey
output: {
publicPath: __NODE_ENV__ === "develop" ? "/" : __NODE_ENV__ === "preProd"
? "//xxxErp/" : "//xxx/Erp/",
path: path.join(__dirname, "dist"),
chunkFilename: "[name].chunk.js",
filename: "[name].js"
},
resolve: {
modules: [path.resolve("src"), "node_modules"],
extensions: [".js", ".jsx"],
/**
*
* require("/Users/kkt/Documents/erp/components/index.js")
* require("components")
* node_modules
*/
alias: {
components: path.dirname(`${__dirname}/src/components/index.js`),
utils: path.dirname(`${__dirname}/src/utils/index.js`),
commonStyle: path.dirname(`${__dirname}/src/utils/common.style.less`),
BussinessCom: path.dirname(`${__dirname}/src/components/BussinessCom/index.js`),
PureCom: path.dirname(`${__dirname}/src/components/PureCom/index.js`)
}
},
mode: NODE_ENV = "develop"? "development": "production",
module: {
// modules.css/less/scss css modules
rules: [
{
test: /\.html$/,
use: [
{
loader: "html-loader"
}
]
},
{
test: /modules\.css$/,
use: ["css-loader?modules&localIdentName=[local]-[hash:base64:5]"]
},
{
test: /^((?!modules).)*\.css$/,
use: ["css-loader"]
},
{
test: /modules\.less$/,
use: ["css-loader?modules&localIdentName=[name]__[local]-[hash:base64:5]!autoprefixer-loader!less-loader"],
},
{
test: /^((?!modules).)*\.less$/,
use: [{
loader: "style-loader" // creates style nodes from JS strings
}, {
loader: "css-loader" // translates CSS into CommonJS
}, {
loader: "less-loader" // compiles Less to CSS
}]
},
{
test: /\.(html)$/,
use: {
loader: "html-loader"
}
},
{
test: /\.(js|jsx)$/,
use: ["babel-loader"],
// exclude: /node_modules/
include: path.join(__dirname, "src")
},
{
test: /\.(jpg|png|gif|jpeg|svg)$/,
use: "url-loader?limit=8192"
},
{
test: /\.json$/,
type: "javascript/auto",
use: "json-loader"
}
]
},
plugins: [
new webpack.DefinePlugin({
"process.env": {
NODE_ENV: __NODE_ENV__ === "develop" || __NODE_ENV__ === "developTruth" ? JSON.stringify("develop") : JSON.stringify("prod"),
},
}),
],
};
if (_ _ NODE_ENV__ = "develop") {
webpackConfig.plugins.push (new webpack.HotModuleReplacementPlugin ());
} else {
webpackConfig.externals = {
react: "React",
"react-dom": "ReactDOM",
antd: "antd",
jquery: "$",
highcharts: "Highcharts",
moment: "moment",
};
if (_ _ NODE_ENV__ = "preProd") {
webpackConfig.plugins.push(
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
}),
new webpack.NoErrorsPlugin()
)
} else {
webpackConfig.plugins.push(
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false,
drop_debugger: true, // debugger
drop_console: true // console
}
}),
new webpack.NoErrorsPlugin()
)
}
}
/ *
- distinguish between modulesCfg.dev and modulesCfg.prod file lists to prevent overwriting other people"s js or old pages
- configure only the portal files you are developing within modulesCfg.prod
* /
if (_ _ NODE_ENV__ = "develop" | | NODE_ENV =" developTruth") {
// develop
AddEntryFile (modulesCfg.dev);
} else {
// preProdprod
AddEntryFile (modulesCfg.prod);
}
/ *
- now all entry files use index.entry.js files as entry files
- only reads the entry file path from the modulesCfg.js, and generally does not need to package all the pages, so it is risky not to deal with it for the time being.
- Optimization: if it is a page, configSingleEntry the singlefile directly. If it is a module, add all the pages of the module
* /
function AddEntryFile (entries) {
if (entries.length = = 0) {
console.log(chalk.red("\n sb? \n"));
return;
}
// filename,
for (let i = 0; I < entries.length; iPP) {
const fileName = entries[i];
//
if (fs.existsSync(path.join(srcDir, fileName, "index.entry.js"))) {
console.log(chalk.green("get entry js success! ", fileName));
configSingleEntry(fileName);
} else if (fs.existsSync(path.join(srcDir, fileName)) && fs.statSync(path.join(srcDir, fileName)).isDirectory()) { // &&
//
const _entries = traverseFile(path.join(srcDir, fileName), "entry.js").map(fileInfo => path.dirname(fileInfo.fPath).replace("src/view/", ""));
AddEntryFile(_entries);
} else {
console.log(chalk.red("InValid! under ", fileName, " there is no entry file! "));
return;
}
}
}
/ *
- configure a single file entry
- @ param {[string]} fileName [File name]
* /
function configSingleEntry (fileName) {
webpackConfig.entry [ ${fileName} / index
] = [. / src/view/$ {fileName} / index.entry.js
];
if (_ _ NODE_ENV__ = = "develop" | | NODE_ENV = = "developTruth") {
webpackConfig.entry[`${fileName}/index`].push(
`webpack-dev-server/client?http://localhost:${modulesCfg.localPORT}`,
"webpack/hot/only-dev-server"
)
}
webpackConfig.plugins.push (new HtmlWebpackPlugin ({
filename: `${fileName}/index.html`,
template: `./src/view/${fileName}/index.html`,
inject: true,
chunks: [`${fileName}/index`],
hash: false,
chunksSortMode: "dependency",
}));
}
module.exports = webpackConfig;
ask the boss to solve