GithubHelp home page GithubHelp logo

Ignore import not working about rtlcss HOT 5 CLOSED

siamak2 avatar siamak2 commented on June 9, 2024
Ignore import not working

from rtlcss.

Comments (5)

siamak2 avatar siamak2 commented on June 9, 2024

I found a dirty solution to fix it for now.
In webpack.mix.js:

const mix = require( 'laravel-mix' );
const fs = require( 'fs' );

mix.before( function () {
	let data = fs.readFileSync( 'node_modules/toastr/build/toastr.css' );
	data = "/*rtl:begin:ignore*/\n" + data + "\n/*rtl:end:ignore*/";
	fs.writeFileSync( 'resources/sass/toastr.css', data );
} )

In resources/sass/app.scss:

@import "toastr.css";

But I'm hoping that you would fix the warning so I can remove this dirty workaround.

from rtlcss.

MohammadYounes avatar MohammadYounes commented on June 9, 2024

@siamak2 You need not to process each file alone. The idea is to have the content placed between the directives then process the final file only.

Your workaround works too.

from rtlcss.

siamak2 avatar siamak2 commented on June 9, 2024

I'm not processing each file alone.
I have one app.scss file that imports other styles. I just don't want rtlcss process specific file which in this case is toastr.css. because that file already have rtl support and rtlcss will revert everything.
I tried this but it didn't worked:

/*rtl:begin:ignore*/
@import "~toastr/build/toastr.css";
/*rtl:end:ignore*/

I know I can run rtlcss from command line on the generated css but I need laravel mix to recognize output file (for cache busting and file watcher)

from rtlcss.

MohammadYounes avatar MohammadYounes commented on June 9, 2024

This is not a problem with rtlcsss. Check the output file being passed to rtlcss, does it contain

/*rtl:begin:ignore*/
... content of toastr.css 
/*rtl:end:ignore*/

or

/*rtl:begin:ignore*/
/*rtl:end:ignore*/
... content of toastr.css 

?

from rtlcss.

siamak2 avatar siamak2 commented on June 9, 2024

I'm not passing the compiled css to rtlcss.
I don't really know how laravel mix works under the hood but I'm instructing it to compile my scss and use rtlcss as a PostCss plugin:

mix.sass( 'resources/sass/app.scss', 'public/css', null, [
        require( 'rtlcss' )
    ] )

The fourth argument is array of PostCss plugins which I passed rtlcss as fourth argument.
The above code works fine for my other ignore blocks but it doesn't work for @import.
Output file of the above code doesn't have any rtlcss comments. I'm guessing that rtlcss removes them.

from rtlcss.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.