javascript - How to copy files from public into dist? - Stack Overflow

admin管理员组

文章数量:1279246

I have a public folder that looks as follows:

After building the project with

"prod": "npm run mlbuild | npm run build"

the dist folder looks as following:

But I am missing config.json, favicon.ico and keycloak.json.

How to take these files into dist folder during the build?

I tried:

  {
    test: /\.(json)(\?v=\d+\.\d+\.\d+)?$/,
    use: [{
      loader: 'file-loader',
      options: {
        name: '[name].[ext]'
      }
    }]
  }

But I think, I have to mention the folder.

I have a public folder that looks as follows:

After building the project with

"prod": "npm run mlbuild | npm run build"

the dist folder looks as following:

But I am missing config.json, favicon.ico and keycloak.json.

How to take these files into dist folder during the build?

I tried:

  {
    test: /\.(json)(\?v=\d+\.\d+\.\d+)?$/,
    use: [{
      loader: 'file-loader',
      options: {
        name: '[name].[ext]'
      }
    }]
  }

But I think, I have to mention the folder.

• javascript
• webpack

Share Improve this question Follow edited May 19, 2018 at 23:14 Eby Jacob 1,45811 gold badge1212 silver badges2929 bronze badges asked May 19, 2018 at 21:01 softshippersoftshipper 34.1k6161 gold badges227227 silver badges451451 bronze badges 1

• Possible duplicate of How to copy static files to build directory with Webpack? – Andrea Carraro Commented May 19, 2018 at 21:54

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 11

You can just setup the plugin copy-webpack-plugin to copy those files, adding this to your webpack.config.js:

plugins: [
    new CopyWebpackPlugin([{ from: 'public' }])
  ]

and the following require: const CopyWebpackPlugin = require('copy-webpack-plugin')

Another solution, if you don't want to do it using webpack, is to use a package to copy those files to the dist folder after the build, adding the following script:

"postprod": "cpx \"public/*\" dist"

and add the package cpx to your list of devDependencies, running npm install cpx --save-dev. Because you added the post prefix to postprod, everytime you run the prod script, npm will automatically run postprod after it, and therefore, will copy all files inside the public folder to the dist folder. You can read more about npm scripts here

本文标签： javascriptHow to copy files from public into distStack Overflow