【发布时间】：2018-08-10 12:49:16
【问题描述】：
我需要将旧系统从gulp 迁移到webpack-4。我坚持将几个脚本连接成一个。我的目标是在没有 webpack 生成的额外人员的情况下实现纯串联。所以 result 来自 gulp 必须等于 来自 webpack 的结果。
这是我的 webpack.config.js
const ConcatPlugin = require('webpack-concat-plugin');
module.exports = [
{
plugins: [
new ConcatPlugin(
{
fileName: "js/bootstrap/bootstrap.js",
filesToConcat: [
"./js/bootstrap/button.js",
"./js/bootstrap/collapse.js",
"./js/bootstrap/datetimepicker.js", // this script requires jQuery and Moment.js
"./js/bootstrap/dropdown.js",
"./js/bootstrap/modal.js",
"./js/bootstrap/multiselect.js",
"./js/bootstrap/tooltip.js",
"./js/bootstrap/popover.js",
"./js/bootstrap/select2.js",
"./js/bootstrap/tab.js",
"./js/bootstrap/transition.js"
]
}
)
}]
这会产生捆绑，但我在里面有额外的代码：
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
和依赖（例如下面的jQuery）
/***/ }),
/***/ "./node_modules/jquery/dist/jquery.js":
/*!********************************************!*\
!*** ./node_modules/jquery/dist/jquery.js ***!
\********************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
eval("var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*!\n * jQuery JavaScript Library v2.2.4\n * http://jquery.com/\n *\n *
表示webpack默认添加了require中定义的依赖./js/bootstrap/datetimepicker.js。当然还添加了来自 moment.js 的依赖项。
我的包非常大，因为它包含我不想包含的其他库。我对jQuery 和moment.js 有外部依赖项
我尝试使用 webpack externals:
externals: {
"jquery": "jQuery"
},
但仍然包含 jQuery。
有没有办法在没有 webpack 引导代码的情况下为 webpack 进行 纯串联？
谢谢
拉法尔
【问题讨论】：
-
webpack 不像 gulp。由于 webpack 是一个打包器，你的文件中会包含 webpack 代码，这就是 webpack 加载内容的方式。
-
webpack 背后的想法是你有一个入口点，你的应用程序从这里开始，然后一切都被解析/转换为浏览器可以理解的内容。 Webpack 还将您的依赖项捆绑在一起，以便可以访问它们。事实上你的外部配置有点错误，但其余的就是它。
-
即使我创建了一个我想要连接的文件数组的条目，默认情况下 webpack 也会这样做——它会尝试解决我的所有依赖项。这就是为什么我试图检查'webpack-concat-plugin'。我是否正确，无法使用 webpack 进行纯连接？
-
是的，你不能“纯连接”。您将始终在某个地方拥有引导代码。
-
如果您为此保留一个 gulp 任务，那不会错。 Webpack 的行为并不类似于 gulp，webpack 是一个捆绑器