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

docs: keep webpack dependency in some cases #7619

Merged
merged 1 commit into from
Aug 20, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions website/docs/en/guide/migration/webpack.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,12 @@ Now you can remove the webpack-related dependencies from your project:

<PackageManagerTabs command="remove webpack webpack-cli webpack-dev-server" />

:::tip
In some cases, you will still need to keep `webpack` as a dev dependency, such as when using [vue-loader](https://github.com/vuejs/vue-loader) or [fork-ts-checker-webpack-plugin](https://github.com/TypeStrong/fork-ts-checker-webpack-plugin).

This is because these plugins directly `import` subpaths of webpack and couple with webpack. If you encounter this issue, you can provide feedback to the maintainers of these plugins, asking them if they can make `webpack` an optional dependency.
:::

## Updating package.json

Update your build scripts to use Rspack instead of webpack:
Expand Down
3 changes: 1 addition & 2 deletions website/docs/en/guide/tech/vue.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ At this time, Rspack will use the built-in CSS processor for post-processing.
If you don't want to generate CSS files, you can also use a combination of [`css-loader`](https://github.com/webpack-contrib/css-loader) and [`vue-style-loader`](https://github.com/vuejs/vue-style-loader):

```js
const config = {
module.exports = {
module: {
rules: [
{
Expand All @@ -73,7 +73,6 @@ const config = {
css: false, // At this point, you need to turn off `experiments.css` to adapt to the internal processing logic of `vue-loader`
},
};
module.exports = config;
```

Besides, as Rspack has built-in TS support, we also support `lang="ts"` configuration by default:
Expand Down
6 changes: 6 additions & 0 deletions website/docs/zh/guide/migration/webpack.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,12 @@ Rspack 的配置是基于 webpack 的设计实现的,以此你能够非常轻

<PackageManagerTabs command="remove webpack webpack-cli webpack-dev-server" />

:::tip
在个别情况下,你仍然需要保留 `webpack` 作为开发依赖,例如使用 [vue-loader](https://github.com/vuejs/vue-loader) 或 [fork-ts-checker-webpack-plugin](https://github.com/TypeStrong/fork-ts-checker-webpack-plugin) 时。

这是因为这些插件直接 `import` 了 webpack 的子路径,与 webpack 产生了耦合。如果你遇到了这种情况,可以向这些插件的维护者反馈,询问他们能否将 `webpack` 作为可选依赖。
:::

## 修改 package.json

更新构建脚本以使用 Rspack 代替 webpack:
Expand Down
3 changes: 1 addition & 2 deletions website/docs/zh/guide/tech/vue.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ module.exports = config;
如果你不希望生成 CSS 文件,也可以直接配合 [`css-loader`](https://github.com/webpack-contrib/css-loader) 和 [`vue-style-loader`](https://github.com/vuejs/vue-style-loader) 组合使用:

```js
const config = {
module.exports = {
module: {
rules: [
{
Expand All @@ -73,7 +73,6 @@ const config = {
css: false, // 此时需要关闭 `experiments.css` 以适配 `vue-loader` 内部处理逻辑
},
};
module.exports = config;
```

除此之外,由于 Rspack 内置了 TS 的支持,因此我们也默认支持了 `lang="ts"` 的配置:
Expand Down
Loading