Incomplete installation instructions

First of all i’ll like to say good work keeping sweetalert alive. I’ve been using the old sweetalert library via cdn. i can’t really remember how i came across your fork.

I don’t know if i’m missing something but the installation instructions seem to be incomplete. After importing the module with

import { default as swal } from 'sweetalert2'.

It’s not documented that you also have to import/require the css files so all the styles and buttons can be loaded also. In my case with npm. It was a simple.

import './node_modules/sweetalert2/dist/sweetalert2.css'

Ideally i feel it would make more sense if i just imported swal and internally the css has already been imported. because i don’t think anyone would want to use sweetalert2 without the buttons and the css.

[toverux]

I agree, we really should document the styles part.

Don’t forget that import 'sweetalert2/dist/sweetalert2.css'; is specific to module bundlers (for example Webpack) so we can’t just put “import the CSS file using an import statement” on the README, or we may confuse a lot of users. I already see those issues such as “I’ve imported the CSS with import but it says syntax error, please fix your syntax yo”. The fact is, it’s difficult to document every build systems on earth, because something like <link rel="stylesheet" type="text/css" href="node_modules/sweetalert2/etc.css" /> is also a solution for others.

I’m really in favor of embedding the styles into the library, that would make the things much simpler and we could benefit of tree-shaking on the styles too (once the library has the right structure for this). But we also have users that use our SCSS source, so this approach has downsides too.

because i don’t think anyone would want to use sweetalert2 without the buttons and the css.

😂 At least we have a DIY version.

[danidee10]

@toverux but at least we should have a section, that says

“don’t forget to import the stylesheet sweetalert2.css” or something similar

or maybe a FAQ section to answer the question of “sweetalert2 styles are not working”

My point is there should be something in the docs that gives a pointer to the css file, even though it’s not bundler specific.