Javascript 如何使用webpack将脚本文件从src复制到dist

我是新来的网页，并试图学习它。我一直在尝试使用webpack将我的供应商js文件和自定义jquery脚本从src复制到dist。我试过了，但找不到任何办法

这就是我的文件夹结构：

• 项目\根\文件夹
  • 节点单元/
  • package.json
  • src/
  • 应用程序/
    • app.js
  • img/
    • img1.png
  • css/
    • main.scss
  • js/
    • 自定义_slick.js
    • main.js
    • 插件/
    • jquery.min.js
    • slick.min.js
  • 哈巴狗

  • 关于帕格
  • 帕格

  • 距离/

  • webpack.config.js

我的webpack.config文件

        var path = require("path"),
        src = path.resolve(__dirname, "src"),
        dist = path.resolve(__dirname, "dist"),
        webpack = require("webpack"),
        HtmlWebpackPlugin = require("html-webpack-plugin"),
        HtmlWebpackPugPlugin = require('html-webpack-pug-plugin'),
        ExtractTextPlugin = require("extract-text-webpack-plugin"),

        extractPlugin = new ExtractTextPlugin({
          filename: "css/main.css"
        });

    module.exports = {
      entry: src + "/app/app.js",
      output: {
        path: dist,
        filename: "bundle.js",
        publicPath: "/"
      },
      module: {
        rules: [
        {                                                                               //Convert .pug to .html
          test: /\.pug$/,
          loaders: ['file-loader?name=[name].html', 'pug-html-loader?pretty&exports=false']
        },
        {
          test: /\.scss$/,                                   //convert .scss to .css
          use: extractPlugin.extract({
            use: ["css-loader", "sass-loader?minimize=true"]
          })
        },
        {
          test: /..\js\$\.js$/,                   // move all .js files in js folder
          use: [
            {
              loader: "file-loader",
              options: {
                name: "[name].js",
                outputPath: "js/"
              }
            }
          ]
        },
        {
          test: /..\js\plugins\.js$/,
          use: [
                 {
                    loader: "file-loader",
                    options: {
                    name: "js/plugins/[name].js",
                    outputPath: "js/plugins/"
                    }
                 }
              ]
          }
        ]
      },
      plugins: [
        extractPlugin
      ]
    }

App.js文件

import '../css/main.scss';

require.context('../js/', true, /\.js$/);                 //require all js files in js folder
require.context('../js/plugins/', true, /\.js$/);        // all js files in plugins folder which is inside js folder

function requirAll (r) { r.keys().forEach(r); }
requireAll(require.context('../', true, /\.pug$/));

另外，当我运行这个配置文件时，我注意到只有后缀为“-js”的脚本文件被复制，而js/文件夹中包含的任何其他js文件（例如文件名“main.js”）都不会被复制，但是如果它被命名为“main js.js”，那么它就会被复制到我的dist文件夹中，我无法从plugins/文件夹复制文件。我无法理解这一点

我已经尝试了所有可能的解决方案，包括堆栈溢出、GitHub和类似的网站，但没有一个是有用的。我还发现这个网页非常混乱。在转到webpack之前，我一直在使用Gulp，我发现它更有用。我偶然发现webpack并想学习它，但我发现它非常困难。

尝试使用它在文件夹之间复制文件

---

我不知道你为什么要复制js文件，webpack就像一个树依赖性求解器，所以它应该得到一个入口点（树的入口点）并创建一个包含整个依赖性树的包。

我想实现的是。。。正在使用jquery库编写函数。。。我不想把它包在包里。。。我只是想把这些js文件分开。这就是为什么我只想把js文件从src复制到dist文件夹的原因。我试着用这个方法，但是我的dist文件夹里有一些奇怪的文件夹结构。这就是我在配置文件中所做的：copyWebpackPlugin=newCopyPlugin（[{from:“src/js/*”，to:“js/”}]）我的dist/contains>dist/js/src/js/（所有我的js文件来自src/js/）它总是相对于

输出.path

字段。您可以指定jQuery是一个

外部

文件，并且webpack不会捆绑它。这不仅仅是jquery。。。我写了很多其他的js代码，我不想捆绑。在开发时，我希望将我的所有js文件（功能js代码）复制到我的生产文件夹，即dist/。这是更简单的与吞咽，但网页包是使之接触，以完成这一点。