Skip to content

Unable to import * from csstips using rollup #13

@kellycampbell

Description

@kellycampbell

I'm trying to use csstips in a server-side rendered app. The same import style doesn't work for both.

When I use the following in a .tsx file:

import * as csstips from 'csstips';
import * as csx from 'csx';

the resulting rollup js for csstips is this:

    var csstips = /*#__PURE__*/Object.freeze({
        default: index,
        __moduleExports: lib
    });

and the generated code has undefined where I use csstips functions:

style(csstips.vertical, csstips.centerJustified, csstips.width(450))

in the original .tsx file becomes the following in the rolled up js:

style(undefined, undefined(percent(100)), undefined(percent(100))

causing an error like TypeError: undefined is not a function


Changing the import style to this fixes the problem for the browser, but doesn't work for the server side:

import csstips from 'csstips';
import * as csx from 'csx';

The csx imports work for both SSR and browser however.

Note: I originally reported this issue here as I thought it was a tool problem unrelated to the csstips library code: bazel-contrib/rules_nodejs#933

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions