Skip to content

Commit 7c0fd02

Browse files
BobbieGoedeBobbieGoede
authored
feat: support rspack (#444)
* feat: support rspack * fix: linting errors * test: add names to test matrix * docs: add `rspack` to readme * chore: use rspack config naming * test: split snapshots by framework * test: split snapshots only for `unplugin-vue-i18n` tests
1 parent cab3b42 commit 7c0fd02

38 files changed

+3235
-561
lines changed

‎.github/workflows/test.yml‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,12 +17,13 @@ env:
1717

1818
jobs:
1919
test:
20-
name: 'Test on Node.js ${{ matrix.node }} OS: ${{matrix.os}}'
20+
name: 'Test on Node.js ${{ matrix.node }} OS: ${{matrix.os}} (${{ matrix.framework }})'
2121
runs-on: ${{ matrix.os }}
2222
strategy:
2323
matrix:
2424
os: [ubuntu-latest]
2525
node: [18, 20, 22]
26+
framework: ['vite', 'rspack', 'webpack']
2627
steps:
2728
- name: Checkout
2829
uses: actions/checkout@v4
@@ -58,3 +59,5 @@ jobs:
5859

5960
- name: Testing
6061
run: pnpm test
62+
env:
63+
TEST_FRAMEWORK: ${{ matrix.framework }}

‎examples/rspack/index.html‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>unplugin-vue-i18n example for rspack</title>
6+
</head>
7+
<body>
8+
<div id="app">
9+
<App />
10+
</div>
11+
<script src="/dist/main.js"></script>
12+
</body>
13+
</html>

‎examples/rspack/rspack.config.js‎

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
// @ts-check
2+
const path = require('path')
3+
const { VueLoaderPlugin } = require('vue-loader')
4+
const VueI18nPlugin = require('../../packages/unplugin-vue-i18n/lib/rspack.cjs')
5+
6+
function transformI18nBlock(source) {
7+
const sourceCopy = source
8+
const block = JSON.parse(
9+
sourceCopy.replace(/[\n\s]/g, '').replace(/,\]$/, ']')
10+
)
11+
if (Array.isArray(block)) {
12+
const transformedBlock = JSON.stringify({
13+
en: {
14+
language: 'Language',
15+
hello: 'hello, world!'
16+
},
17+
ja: {
18+
language: '言語',
19+
hello: 'こんにちは、世界！'
20+
}
21+
})
22+
return transformedBlock
23+
}
24+
return source
25+
}
26+
27+
/**
28+
* @type {import('@rspack/core').RspackOptions}
29+
**/
30+
module.exports = {
31+
mode: 'development',
32+
devtool: 'source-map',
33+
entry: path.resolve(__dirname, './src/main.js'),
34+
output: {
35+
path: path.resolve(__dirname, 'dist'),
36+
filename: '[name].js',
37+
publicPath: '/dist/'
38+
},
39+
resolve: {
40+
alias: {
41+
vue: path.resolve(
42+
__dirname,
43+
'../../node_modules/vue/dist/vue.esm-bundler.js'
44+
)
45+
}
46+
},
47+
devServer: {
48+
static: {
49+
directory: path.join(__dirname, './')
50+
}
51+
},
52+
module: {
53+
rules: [
54+
{
55+
test: /\.vue$/,
56+
loader: 'vue-loader'
57+
},
58+
{
59+
test: /\.js$/,
60+
loader: 'babel-loader'
61+
}
62+
]
63+
},
64+
plugins: [
65+
new VueLoaderPlugin(),
66+
VueI18nPlugin({
67+
include: [path.resolve(__dirname, './src/locales/**')],
68+
transformI18nBlock: transformI18nBlock
69+
})
70+
]
71+
}

‎examples/rspack/src/App.vue‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<template>
2+
<form>
3+
<label>{{ t('language') }}</label>
4+
<select v-model="locale">
5+
<option value="en">en</option>
6+
<option value="ja">ja</option>
7+
</select>
8+
</form>
9+
<p>{{ t('hello') }}</p>
10+
<Banana />
11+
<Apple />
12+
</template>
13+
14+
<script>
15+
import { useI18n } from 'vue-i18n'
16+
import Apple from './Apple.vue'
17+
import Banana from './Banana.vue'
18+
19+
export default {
20+
name: 'App',
21+
components: {
22+
Apple,
23+
Banana
24+
},
25+
setup() {
26+
const { t, locale } = useI18n({
27+
inheritLocale: true,
28+
useScope: 'local'
29+
})
30+
return { t, locale }
31+
}
32+
}
33+
</script>
34+
35+
<i18n>
36+
{
37+
"en": {
38+
"language": "Language",
39+
"hello": "hello, world!"
40+
},
41+
"ja": {
42+
"language": "言語",
43+
"hello": "こんにちは、世界！"
44+
}
45+
}
46+
</i18n>

‎examples/rspack/src/Apple.vue‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<template>
2+
<p>{{ t('language') }}</p>
3+
<p>{{ t('hello') }}</p>
4+
</template>
5+
6+
<script>
7+
import { useI18n } from 'vue-i18n'
8+
9+
export default {
10+
name: 'Apple',
11+
setup() {
12+
const { t } = useI18n({
13+
inheritLocale: true,
14+
useScope: 'local'
15+
})
16+
return { t }
17+
}
18+
}
19+
</script>
20+
21+
<i18n>
22+
[
23+
"language",
24+
"hello",
25+
]
26+
</i18n>

‎examples/rspack/src/Banana.vue‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
<template>
2+
<form id="fruits">
3+
<label>{{ t('select') }}</label>
4+
<select v-model.number="select">
5+
<option value="0">0</option>
6+
<option value="1">1</option>
7+
<option value="2">2</option>
8+
<option value="3">3</option>
9+
</select>
10+
</form>
11+
<p>{{ t('fruits.banana', select, { n: select }) }}</p>
12+
</template>
13+
14+
<script>
15+
import { ref, watch } from 'vue'
16+
import { useI18n } from 'vue-i18n'
17+
18+
export default {
19+
name: 'Banana',
20+
setup() {
21+
const { t, locale } = useI18n({ useScope: 'global' })
22+
watch(locale, (val, old) => {
23+
console.log('locale changed', val, old)
24+
})
25+
const select = ref(0)
26+
return { t, select }
27+
}
28+
}
29+
</script>

‎examples/rspack/src/locales/en.yaml‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
select: Do you want banana?
2+
fruits:
3+
banana: 'no bananas | {n} banana | {n} bananas'

‎examples/rspack/src/locales/ja.json‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"select": "バナナが欲しい？",
3+
"fruits": {
4+
"banana": "バナナがない | バナナ {n} 個"
5+
}
6+
}

‎examples/rspack/src/main.js‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import { createApp } from 'vue'
2+
import { createI18n } from 'vue-i18n'
3+
import App from './App.vue'
4+
5+
import ja from './locales/ja.json'
6+
import en from './locales/en.yaml'
7+
8+
const i18n = createI18n({
9+
locale: 'ja',
10+
messages: {
11+
en,
12+
ja
13+
}
14+
})
15+
16+
const app = createApp(App)
17+
18+
app.use(i18n)
19+
app.mount('#app')

‎package.json‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,8 @@
3333
"@rollup/plugin-node-resolve": "^13.0.0",
3434
"@rollup/plugin-replace": "^2.4.2",
3535
"@rollup/pluginutils": "^4.1.0",
36+
"@rspack/cli": "^1.2.7",
37+
"@rspack/core": "^1.2.7",
3638
"@types/debug": "^4.1.5",
3739
"@types/eslint": "^9.6.1",
3840
"@types/js-yaml": "^4.0.3",
@@ -109,8 +111,10 @@
109111
"build:example": "run-s \"build:example:vite {@}\" \"build:example:webpack\" --",
110112
"build:example:vite": "cd examples/vite && vite build --config ./vite.config.ts --outDir ./dist",
111113
"build:example:webpack": "pnpm build && webpack --config ./examples/webpack/webpack.config.js",
114+
"build:example:rspack": "pnpm build && rspack --config ./examples/rspack/rsbuild.config.js",
112115
"play:vite": "vite examples/vite -c examples/vite/vite.config.ts",
113116
"play:webpack": "pnpm run build:unplugin && webpack serve --config ./examples/webpack/webpack.config.js",
117+
"play:rspack": "rspack dev --config ./examples/rspack/rspack.config.js",
114118
"preview:vite": "vite preview examples/vite --outDir dist",
115119
"check-install": "jiti scripts/playwright.ts",
116120
"clean": "run-p \"clean:*\"",
@@ -133,10 +137,14 @@
133137
"test:e2e:vite": "pnpm --filter @intlify/vite-plugin-vue-i18n test:e2e",
134138
"test:e2e:webpack": "pnpm --filter @intlify/vue-i18n-loader test:e2e",
135139
"test:e2e:unplugin": "pnpm --filter @intlify/unplugin-vue-i18n test:e2e",
136-
"test:unit": "run-s \"test:unit:utils {@}\" \"test:unit:unplugin {@}\" --",
140+
"test:unit": "run-s \"test:unit:utils {@}\" \"test:unit:unplugin\" --",
137141
"test:unit:utils": "vitest run packages/bundle-utils",
138142
"test:unit:rollup": "vitest run packages/rollup-plugin-vue-i18n/test",
139143
"test:unit:unplugin": "vitest run packages/unplugin-vue-i18n/test",
144+
"test:unit:unplugin-all": "run-s \"test:unit:unplugin:*\"",
145+
"test:unit:unplugin:vite": "TEST_FRAMEWORK=vite vitest run packages/unplugin-vue-i18n/test",
146+
"test:unit:unplugin:webpack": "TEST_FRAMEWORK=webpack vitest run packages/unplugin-vue-i18n/test",
147+
"test:unit:unplugin:rspack": "TEST_FRAMEWORK=rspack vitest run packages/unplugin-vue-i18n/test",
140148
"changelog": "jiti ./scripts/changelog.ts",
141149
"changelog:utils": "pnpm --filter @intlify/bundle-utils changelog",
142150
"changelog:rollup": "pnpm --filter @intlify/rollup-plugin-vue-i18n changelog",

0 commit comments

Comments
 (0)