Как создается файл main.js? - PullRequest
Новая
       14

Как создается файл main.js?

1 голос
/ 27 июня 2019

Я пытаюсь реконструировать существующую кодовую базу, которую я перенял у предыдущего подрядчика, и у меня возникают трудности с выяснением, как создается конкретный файл main.js, чтобы я мог его изменить.

База кода представляет собой набор файлов javascript, а в главном каталоге также находится файл на основе webpack-dev-server.

Я пытался скомпилировать код, используя webpack-dev-server с использованием флага --watch.Однако выходной файл main.js является подробным и хорошо отформатированным, в то время как создаваемый в данный момент файл main.js минимизируется и сжимается.Мне нужно, чтобы файл main.js создавался точно таким же образом.

Это файл webpack-dev-server 


const webpack = require('webpack');

const HtmlWebpackPlugin = require('html-webpack-plugin');
const HtmlWebpackHarddiskPlugin = require('html-webpack-harddisk-plugin');

module.exports = {
  output: {
    path: `${__dirname}./../backend/templates`,
    filename: 'main.js',
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: 'static/index.html',
      alwaysWriteToDisk: true,
    }),
    new HtmlWebpackHarddiskPlugin(),

    new webpack.EnvironmentPlugin({
      API_HOST: null,
      NODE_ENV: 'development',
      DEBUG: false,
    }),
  ],
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader',
          options: {
            plugins: ['@babel/plugin-proposal-class-properties'],
          },
        },
      },
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader'],
      },
      {
        test: /\.svg$/,
        use: [
          {
            loader: 'babel-loader',
          },
          {
            loader: 'react-svg-loader',
          },
        ],
      },
    ],
  },
};

Это фрагмент файла main.js.ДОЛЖЕН быть произведен: 

!function(e){var t={};function n(r){if(t[r])return t[r].exports;var a=t[r]={i:r,l:!1,exports:{}};return e[r].call(a.exports,a,a.exports,n),a.l=!0,a.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var a in e)n.d(r,a,function(t){return e[t]}.bind(null,a));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=234)}([function(e,t,n){e.exports=n(143)()},function(e,t,n){"use strict";e.exports=n(115)},function(e,t,n){var r=n(46),a=n(130),o=n(131),i=n(15),u=n(36),c=n(16),l=Object.prototype.hasOwnProperty,s=o(function(e,t){if(u(t)||i(t))a(t,c(t),e);else for(var n in t)l.call(t,n)&&r(e,n,t[n])});e.exports=s},function(e,t,n){var

Он имеет следующие комментарии: 

/*
object-assign
(c) Sindre Sorhus
@license MIT
/** @license React v16.5.2
 * react.production.min.js
 *
 * Copyright (c) Facebook, Inc. and its affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */
 /** @license React v16.5.2
 * react-dom.production.min.js
 *
 * Copyright (c) Facebook, Inc. and its affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 *
/
/** @license React v16.5.2
 * schedule.production.min.js
 *
 * Copyright (c) Facebook, Inc. and its affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */
 /** @license React v16.5.2
 * react-is.production.min.js
 *
 * Copyright (c) Facebook, Inc. and its affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */

И это файл main.js фрагмента, который создается webpack-dev-server: 

"use strict";
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony default export */ __webpack_exports__[\"default\"] = (function(x) {\n  return x === null ? NaN : +x;\n});\n\n\n//# sourceURL=webpack:///./node_modules/d3-array/src/number.js?");

Как видите, версия webpack-dev-server более многословна.В реальном файле main.js есть также комментарии, которые ссылаются на response.production.min.js и другие подобные файлы.Я думаю, что мин относится к минификации.Однако мне не удалось выяснить, какие пакеты или продукты использовать для создания файла точно таким же образом.

...