Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

The Generated javascript file from flowbite-svelte is bigger than the generated js file from flowbite #254

Open
Abdulrhman311 opened this issue Oct 2, 2022 · 1 comment
Labels
bug Something isn't working help wanted Extra attention is needed

Comments

@Abdulrhman311
Copy link

Abdulrhman311 commented Oct 2, 2022

The Generated javascript file from flowbite-svelte is 74kb
in the other hand the generated file from flowbite is almost 3.5kb
so why the output from flowbite-svelte is very bigger than flowbite

output size
Screenshot from 2022-10-02 20-27-05

ROLLUP Config File


require('dotenv').config();
const { getRollupConfig } = require('@elderjs/elderjs');
const svelteConfig = require('./svelte.config');
module.exports = [...getRollupConfig({ svelteConfig
})];
  

Navbar.svelte

<script>
  
  import  Navbar from "../components/navbar/Navbar.svelte";
  import NavBrand from "../components/navbar/NavBrand.svelte";
  import   NavLi from "../components/navbar/NavLi.svelte";
  import  NavUl  from "../components/navbar/NavUl.svelte";
  import  NavHamburger  from "../components/navbar/NavHamburger.svelte";

</script>

<Navbar let:hidden let:toggle>
  <NavBrand href="/">
    <img
      src="https://flowbite.com/docs/images/logo.svg"
      class="mr-3 h-6 sm:h-9"
      alt="Flowbite Logo"
    />
    <span class="self-center whitespace-nowrap text-xl font-semibold dark:text-white">
      Flowbite
    </span>
  </NavBrand>
  <NavHamburger  on:click={toggle} />
  <NavUl   {hidden}>
    <NavLi href="/" active={true}>Home</NavLi>
    <NavLi href="/">About</NavLi>
    <NavLi href="/">Services</NavLi>
    <NavLi href="/">Pricing</NavLi>
    <NavLi href="/">Contact</NavLi>
  </NavUl>
</Navbar>

svelte.config.js

const sveltePreprocess = require('svelte-preprocess');
const { terser } = require('rollup-plugin-terser');
const production = process.NODE_ENV === 'production';
module.exports = {



  preprocess: [
    sveltePreprocess({
      sourceMap: !production,
      postcss: { 
        whitelistPatterns: [/svelte-/],
        plugins: [require('tailwindcss'), require('autoprefixer'),

      
      ],

      },
      dev: !production,
    }),

  ],
};
@eight04 eight04 added bug Something isn't working help wanted Extra attention is needed labels Nov 4, 2022
@eight04
Copy link
Contributor

eight04 commented Nov 5, 2022

I have never used flowbite and I don't understand how does it relate to elderjs. Could you provide a full repro?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working help wanted Extra attention is needed
Projects
None yet
Development

No branches or pull requests

2 participants