Question

我的目录结构是这样的。

directory structure

我想使用"build": "webpack --config webpack.prod.js --progress",，然后案例将创建一个名为product的新文件夹。

我希望这个新文件夹可以创建一个名为config的文件夹，该文件夹从其中config文件夹中名为public的文件夹中复制，并包含setting.js，并创建一个名为virtual的文件夹，也是从公共文件中复制的。

但我不知道如何配置webpack.prod.js

const merge = require('webpack-merge');
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
const common = require('./webpack.common.js');

const webpack = require('webpack');
const merge = require('webpack-merge');
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const manifest = require('./public/dist/vendor-manifest.json');
const common = require('./webpack.common.js');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const path = require('path');
const HtmlWebpackHarddiskPlugin = require('html-webpack-harddisk-plugin');
const HtmlWebpackIncludeAssetsPlugin = require('html-webpack-include-assets-plugin');

module.exports = {
    entry: {
        app: './src/main.js'
    },
    output: {
        filename: 'dist/[name].[chunkhash:8].js',
        path: path.resolve(__dirname, 'product')
    },
    plugins: [
        new HtmlWebpackPlugin({
            filename: './index-package.html',
            template: './src/index.html',
            favicon: './src/favicon.ico',
            alwaysWriteToDisk: true
        }),
        new HtmlWebpackIncludeAssetsPlugin({
            assets: ['dist/'+ manifest.name + '.dll.js'],
            append: false // 不会被 webpack 自动打包
        }),
        new HtmlWebpackHarddiskPlugin(), // 将[venderName + '.js']和['env-config.js']放进 index.html 中
        new UglifyJSPlugin()
    ],
};

的package.json

{
    "name": "development",
    "version": "1.0.0",
    "description": "",
    "main": "webpack.config.js",
    "scripts": {
        "dev": "webpack-dev-server --config webpack.dev.js --progress",
        "dev-dll": "NODE_ENV=develop webpack --config webpack.dll.js --progress",
        "build": "webpack --config webpack.prod.js --progress",
        "build-dll": "NODE_ENV=production webpack --config webpack.dll.js --progress"
    },
    "keywords": [],
    "author": "",
    "license": "ISC",
    "dependencies": {
        "antd": "^3.1.4",
        "babel-runtime": "^6.26.0",
        "echarts": "^4.0.2",
        "react": "^16.1.1",
        "react-dom": "^16.1.1",
        "react-router-dom": "^4.2.2"
    },
    "devDependencies": {
        "babel-core": "^6.26.0",
        "babel-eslint": "^8.0.2",
        "babel-jest": "^21.2.0",
        "babel-loader": "^7.1.2",
        "babel-plugin-import": "^1.6.2",
        "babel-plugin-transform-runtime": "^6.23.0",
        "babel-polyfill": "^6.26.0",
        "babel-preset-env": "^1.6.1",
        "babel-preset-react": "^6.24.1",
        "babel-preset-stage-0": "^6.24.1",
        "body-parser": "^1.18.2",
        "clean-webpack-plugin": "^0.1.17",
        "cookie-parser": "^1.4.3",
        "css-loader": "^0.28.7",
        "eslint": "^4.11.0",
        "eslint-loader": "^1.9.0",
        "eslint-plugin-react": "^7.4.0",
        "express": "^4.16.2",
        "extract-text-webpack-plugin": "^3.0.2",
        "file-loader": "^1.1.5",
        "html-webpack-exclude-assets-plugin": "0.0.6",
        "html-webpack-plugin": "^2.30.1",
        "html-webpack-template": "^6.1.0",
        "jest": "^21.2.1",
        "json-loader": "^0.5.7",
        "less": "^2.7.3",
        "less-loader": "^4.0.5",
        "prop-types": "^15.6.0",
        "redux-devtools": "^3.4.1",
        "style-loader": "^0.19.0",
        "url-loader": "^0.6.2",
        "csv-loader": "^2.1.1",
        "webpack": "^3.8.1",
        "webpack-dev-middleware": "^1.12.0",
        "webpack-dev-server": "^2.9.4",
        "webpack-merge": "^4.1.0",
        "xml-loader": "^1.2.1",
        "webpack-bundle-analyzer": "^2.9.2",
        "html-webpack-harddisk-plugin": "^0.1.0",
        "html-webpack-include-assets-plugin": "^1.0.2"
    }

}

节点版本v6.11.3

Answer 1

试试这个插件？希望这适合你。

https://github.com/webpack-contrib/copy-webpack-plugin

使用webpack打包，如何将已存在的文件复制到新文件夹？

1 个答案: