webpack-rtl-plugin icon indicating copy to clipboard operation
webpack-rtl-plugin copied to clipboard

Generated file missing in the manifest

Open redayoub opened this issue 7 years ago • 9 comments

I'm using this plugin with webpack-manifest-plugin, but the generated rtl files are missing in the manifest.json file, is there any way to add them automatically ? also Is there a way to use rtl-css-loader with sass files, I tried to to that but it fails.

redayoub avatar Oct 31 '17 22:10 redayoub

up

redayoub avatar Nov 03 '17 12:11 redayoub

Adding this to the manifest would be great.

JakeHenshall avatar Nov 05 '17 01:11 JakeHenshall

up

redayoub avatar Nov 27 '17 01:11 redayoub

up

redayoub avatar Nov 30 '17 13:11 redayoub

up

redayoub avatar Dec 04 '17 11:12 redayoub

Hi, can you show me your webpack configuration so I can test it? Thanks

romainberger avatar Dec 07 '17 13:12 romainberger

sure.

import path from 'path'
import webpack from 'webpack'
import ManifestPlugin from 'webpack-manifest-plugin'
import UglifyJSPlugin from 'uglifyjs-webpack-plugin'
import CleanWebpackPlugin from 'clean-webpack-plugin'
import ExtractTextPlugin from 'extract-text-webpack-plugin'
import WebpackRTLPlugin from 'webpack-rtl-plugin'
import CopyWebpackPlugin from 'copy-webpack-plugin'

const dev = process.env.NODE_ENV === 'dev'

let cssLoaders = [{
    loader: 'css-loader', 
    options: {
        importLoaders: 1,
        minimize: !dev
    }
}]

let config = {
    entry: {
        app: ['./assets/css/app/app.scss', './assets/js/app/app.js']
    },  

    output: {
        path: path.resolve(__dirname, 'web/assets'),
        filename: dev ? 'js/[name].js' : 'js/[name].[chunkhash:8].js',
        publicPath: (dev ? 'https://127.0.0.1:8123' : '') + '/assets/'
    },

    devtool: dev ? 'cheap-module-eval-source-map' : false,

    devServer: {
        contentBase: path.resolve(__dirname, 'web'),
        host: '127.0.0.1',
        port: 8123,
        overlay: true,
        headers: {
            'Access-Control-Allow-Origin': '*',
            'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, PATCH, OPTIONS',
            'Access-Control-Allow-Headers': 'X-Requested-With, content-type, Authorization'
        },
        stats: {
            colors: true
        }
    },

    module: {
        rules: [
            {
                test: /\.css$/,
                use: ExtractTextPlugin.extract({
                    fallback: 'style-loader',
                    use: cssLoaders
                })
            },
            { 
                test: /\.scss$/, 
                use: ExtractTextPlugin.extract({ 
                    fallback: 'style-loader', 
                    use: [...cssLoaders, 'sass-loader']
                })
            },
            {
                test: /\.(png|jpg|jpeg|gif)$/,
                use: [
                    {
                        loader: 'file-loader',
                        options: {
                            name: 'images/[name].[hash:8].[ext]'
                        }  
                    }
                ]
            },
            {
                test: /\.(eot|svg|ttf|woff|woff2)$/,
                use: [
                    {
                        loader: 'file-loader',
                        options: {
                            name: 'fonts/[name].[hash:8].[ext]'
                        }  
                    }
                ]
            }
        ]
    },

    plugins: [
        new ExtractTextPlugin({
            filename: dev ? 'css/[name].css' : 'css/[name].[contenthash:8].css',
            disable: dev
        })
    ]
};

if (!dev) {
    config.plugins.push(new CleanWebpackPlugin([path.resolve(__dirname, 'web/assets/')]));
    config.plugins.push(new UglifyJSPlugin());
    config.plugins.push(new ManifestPlugin());
    config.plugins.push(new WebpackRTLPlugin());
}

export default config;

redayoub avatar Dec 08 '17 10:12 redayoub

An immediate solution would be to add the ManifestPlugin after the WebpackRTLPlugin.

new WebpackRTLPlugin(),
new ManifestPlugin({
  fileName: 'manifest.json',
  map: (file) => {
    if (/\.rtl\.css$/.test(file.path)) {
      file.name = file.name.replace('.css', '.rtl.css');
    }
    return file;
  },
}),`

`

peterfirst avatar Jan 30 '18 13:01 peterfirst

Hi, can you show me your webpack configuration so I can test it? Thanks

Any update on this? It will be a really great feature if it can be added in manifest.

Thanks.

vrushank avatar Oct 17 '19 10:10 vrushank