Skip to content

Commit 948b1be

Browse files
committed
chore: playground
1 parent 12b7d98 commit 948b1be

15 files changed

+171
-8
lines changed

.eslintignore

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
/coverage
2-
/dist
2+
dist
33
/node_modules
4-
/test/fixtures
4+
/test/fixtures

.gitignore

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,10 @@ npm-debug.log*
44
.eslintcache
55

66
/coverage
7-
/dist
7+
dist
88
/local
99
/reports
10-
/node_modules
10+
node_modules
1111
/test/outputs
1212
/test/fixtures/import/import-absolute.css
1313
/test/fixtures/url/url-absolute.css

package-lock.json

Lines changed: 47 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,7 @@
5252
"postcss-modules-local-by-default": "^4.0.3",
5353
"postcss-modules-scope": "^3.0.0",
5454
"postcss-modules-values": "^4.0.0",
55+
"postcss-reporter": "^7.1.0",
5556
"postcss-value-parser": "^4.2.0",
5657
"semver": "^7.5.4"
5758
},

playground/index.html

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>Document</title>
7+
</head>
8+
<body>
9+
<div class="u-m\+">hello world</div>
10+
<script src="dist/main.js"></script>
11+
</body>
12+
</html>

playground/package.json

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
{
2+
"name": "css-loader-demo",
3+
"version": "1.0.0",
4+
"description": "",
5+
"main": "index.js",
6+
"scripts": {
7+
"dev": "webpack serve",
8+
"build": "webpack build",
9+
"test": "echo \"Error: no test specified\" && exit 1"
10+
},
11+
"keywords": [],
12+
"author": "",
13+
"license": "ISC",
14+
"dependencies": {
15+
"html-webpack-plugin": "^5.5.4",
16+
"webpack": "^5.89.0"
17+
},
18+
"devDependencies": {
19+
"css-loader": "^6.8.1",
20+
"mini-css-extract-plugin": "^2.7.6",
21+
"style-loader": "^3.3.3",
22+
"webpack-cli": "^5.1.4",
23+
"webpack-dev-server": "^4.15.1"
24+
}
25+
}

playground/src/index.css

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
.a {
2+
background-image: -webkit-image-set(
3+
url("./rspack-logo.png") 1x,
4+
url("./rspack-logo.png") 2x
5+
);
6+
}

playground/src/index.js

Whitespace-only changes.

playground/src/rspack-logo.png

13.5 KB
Loading

playground/src/style.css

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
:local(.className) {
2+
background: red;
3+
color: yellow;
4+
}
5+
:global(.className1) {
6+
color: red;
7+
}
8+
:local(.subClass) {
9+
composes: className1 from global;
10+
background: blue;
11+
}

playground/src/style2.css

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
body {
2+
color: blue;
3+
}
4+
:export {
5+
v-primary: red;
6+
}

playground/webpack.config.js

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
const path = require("path");
2+
3+
const HtmlWebPackPlugin = require("html-webpack-plugin");
4+
5+
const MiniCssExtractPlugin = require("../../mini-css-extract-plugin/dist");
6+
7+
module.exports = {
8+
entry: "./src/index.js",
9+
mode: "development",
10+
plugins: [
11+
new HtmlWebPackPlugin({
12+
template: "./index.html",
13+
}),
14+
new MiniCssExtractPlugin(),
15+
],
16+
// output: {
17+
// publicPath: '/assets/'
18+
// },
19+
target: "web",
20+
optimization: {
21+
minimize: false,
22+
},
23+
module: {
24+
rules: [
25+
{
26+
test: /\.css$/,
27+
// use: [
28+
// {
29+
// loader: MiniCssExtractPlugin.loader,
30+
// },
31+
// {
32+
oneOf: [
33+
{
34+
assert: { type: "css" },
35+
loader: path.resolve(__dirname, "../dist/index.js"),
36+
options: {
37+
exportType: "css-style-sheet",
38+
modules: true,
39+
},
40+
},
41+
],
42+
// },
43+
// ]
44+
},
45+
// {
46+
// test: /\.css$/,
47+
// },
48+
{
49+
test: /\.png$/,
50+
use: ["file-loader"],
51+
},
52+
],
53+
},
54+
};

src/index.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@
66
import postcss from "postcss";
77
import postcssPkg from "postcss/package.json";
88
import { satisfies } from "semver";
9+
import reporter from "postcss-reporter";
910

1011
import schema from "./options.json";
1112
import { icssParser, importParser, urlParser } from "./plugins";
@@ -169,7 +170,7 @@ export default async function loader(content, map, meta) {
169170
const { resourcePath } = this;
170171

171172
let result;
172-
173+
plugins.push(reporter());
173174
try {
174175
result = await postcss(plugins).process(content, {
175176
hideNothingWarning: true,
@@ -187,7 +188,6 @@ export default async function loader(content, map, meta) {
187188
if (error.file) {
188189
this.addDependency(error.file);
189190
}
190-
191191
callback(
192192
error.name === "CssSyntaxError" ? syntaxErrorFactory(error) : error
193193
);

src/plugins/postcss-icss-parser.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -90,7 +90,6 @@ const plugin = (options = {}) => {
9090

9191
options.api.push({ importName, dedupe: true, index });
9292
}
93-
9493
for (const [replacementIndex, token] of Object.keys(
9594
item.tokens
9695
).entries()) {

src/utils.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,8 @@ import path from "path";
88
import modulesValues from "postcss-modules-values";
99
import localByDefault from "postcss-modules-local-by-default";
1010
import extractImports from "postcss-modules-extract-imports";
11-
import modulesScope from "postcss-modules-scope";
11+
12+
import modulesScope from "../../postcss-modules-scope";
1213

1314
const WEBPACK_IGNORE_COMMENT_REGEXP = /webpackIgnore:(\s+)?(true|false)/;
1415

@@ -779,6 +780,7 @@ function getModulesPlugins(options, loaderContext) {
779780
extractImports(),
780781
modulesScope({
781782
generateScopedName(exportName) {
783+
console.log(exportName);
782784
let localIdent;
783785

784786
if (typeof getLocalIdent !== "undefined") {

0 commit comments

Comments
 (0)