Open jayu opened 4 years ago
What about Snowpack integration?
There is a statement in their docs which seems to be false in case of Linaria:
Snowpack also supports any popular CSS-in-JS library
@amankkg I made an attempt to integrate Linaria with Snowpack, using the following plugin:
const babel = require("@babel/core");
const fs = require("fs");
const path = require("path");
const { promisify } = require("util");
const transform = require("linaria/lib/transform");
const readFile = promisify(fs.readFile);
module.exports = function (snowpackConfig, pluginOptions) {
const { sourceMap, preprocessor, ...rest } = pluginOptions;
return {
name: "snowpack-linaria-plugin",
resolve: {
input: [".js", ".jsx", ".ts", ".tsx", ".mjs"],
output: [".js", ".css"],
},
async load({ filePath }) {
const contents = await readFile(filePath, "utf-8");
const result = transform(contents, {
filename: path.basename(filePath),
preprocessor,
pluginOptions: rest,
});
if (!result.cssText) {
return {
".js": await babel.transformAsync(contents, { filename: filePath }),
};
}
return {
".js": await babel.transformAsync(result.code, {
filename: filePath,
inputSourceMap: result.sourceMap,
}),
".css": { code: result.cssText, map: result.cssSourceMapText },
};
},
};
};
It's a little bit unfortunate I need to manually invoke Babel, but it mostly seems to do the trick... Except I now run into a runtime issue: TypeError: validAttr is not a function
. I have tracked this to react/styled.ts
where the import of validAttr
seems to be miscompiled (it correctly inlines the dependency, but then tries to take the .default
property of that dependency, which doesn't exist because it's not an exports object). At first sight it would appear a Snowpack issue, but my gut says more should be broken if that were the case, so I'm not sure where to look now.
@arendjr Have you had any luck since? Would love to see linaria working in snowpack.
No, to be honest, I gave up on it for now.
parcel plugin doesn't work with Parcel 2 version.
@jayu because of https://github.com/vercel/next.js/pull/41085/files do you think that the Next.js example can be checked off?
Describe the enhancement
Firstly we add more chapters to
docs/CONFIGURATION.md
to group working integrationswith-linaria
exampleThen modify Setup section in README and list there all possible working integrations from
docs/CONFIGURATION.md
with links obviously.I'm not sure what to do with Linaria parcel plugin. I mean we can link it anyway, but I don't know if it is stable.
Motivation
There are tool/frameworks that work with linaria but integrations are not documented
Possible implementations
Related Issues
434 , #435