react-toolbox-example icon indicating copy to clipboard operation
react-toolbox-example copied to clipboard

How do I add an images folder to the build?

Open Whiplash5057 opened this issue 8 years ago • 0 comments

  • webpack.config.js file
const path = require('path');
const webpack = require('webpack');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const extractPlugin = new ExtractTextPlugin({
  filename: 'main.css'
});
const HTMLWebpackPlugin = require('html-webpack-plugin');
const htmlplugin = new HTMLWebpackPlugin({
      template: 'src/www/index.html'
      // baseUrl: './'
    });
const settings = {
  entry: {
    bundle: [
      'react-hot-loader/patch',
      './src/frontend/index.js'
    ]
  },
  output: {
    filename: '[name].js',
    publicPath: '',
    path: path.resolve('build')
  },
  resolve: {
    extensions: ['.js', '.json', '.css']
  },
  devtool: 'eval-source-map',
  module: {
    rules: [
      {
        test: /\.html$/,
        use: ['html-loader']
      },
      {
        test: /\.js?$/,
        loader: 'babel-loader',
        options: {
          presets: [
            ['es2015', { modules: false }],
            'stage-2',
            'react'
          ],
          plugins: [
            'transform-node-env-inline'
          ],
          env: {
            development: {
              plugins: ['react-hot-loader/babel']
            }
          }
        }
      },
      {
        test: /\.sass$/,
        use: extractPlugin.extract({
          use: [{
            loader: 'css-loader',
            options: {
              minimize: true
            }
          },
          'sass-loader']
        })
      },
      {
        test: /\.(jpg|png)$/,
        use: [
          {
            loader: 'file-loader',
            options: {
              name: '[name].[ext]',
              outputPath: 'img/',
              publicPath: 'img/'
            }
          }
        ]
      },
      {
        test: /\.(css)$/,
        use: [
          'style-loader',
          {
            loader: 'css-loader',
            options: {
              modules: true,
              sourceMap: true,
              importLoaders: 1,
              localIdentName: '[name]--[local]--[hash:base64:8]'
            }
          },
          'postcss-loader' // has separate config, see postcss.config.js nearby
        ]
      }
    ]
  },
  devServer: {
    contentBase: path.resolve('src/www'),
    publicPath: 'http://localhost:8080/', // full URL is necessary for Hot Module Replacement if additional path will be added.
    quiet: false,
    hot: true,
    historyApiFallback: true,
    inline: true
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NamedModulesPlugin(),
    new webpack.LoaderOptionsPlugin({
      debug: true
    }),
    htmlplugin,
    extractPlugin,
    new CleanWebpackPlugin(['build'])
  ]
};

module.exports = settings;



I have an image folder in my src.... But img folder is not getting created in my build folder and there is no error to debug HELP!!

Whiplash5057 avatar May 08 '17 12:05 Whiplash5057