Skip to content

Commit db9f292

Browse files
lxsmnsyclxsmnsyc
authored
0.7.0 (#54)
* Set `granular` mode as default * Fix snapshots * Add JSX HMR * Fix opts check * Fix `Parcel` document * Add support for `ref` * Fix bubbled functions not transformed properly * Fix redundant bubbling * Fix deep optimization * Fix snapshots * Revert deep JSX HMR * Fix snapshots * Simplify stuffs * Update transform-jsx.ts * Add support for `use:*` directive * Add playground * Fix playground * Fix JSX extraction * Update App.tsx * Add location info for templates * Fix snapshots * Update example.js * Update index.ts * Fix support for `ExportNamedDeclaration` * Add `granular` flag * Update index.ts * Fix excess * Change
1 parent e1608f5 commit db9f292

71 files changed

Lines changed: 20254 additions & 12298 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎README.md‎

Lines changed: 38 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ You can read the following guides first, respectively:
3737
* [Rspack](https://www.rspack.dev/guide/dev-server.html#hmr)
3838
* [Rspack SolidJS guide](https://www.rspack.dev/guide/solid.html)
3939

40-
> **Note**
40+
> [!NOTE]
4141
> Rspack has HMR already enabled by default. The guide only tells you how to disable it or run the dev server on a proxy server.
4242
4343
Requires the use of [`babel-loader`](https://www.npmjs.com/package/babel-loader). Add the following to `.babelrc`:
@@ -75,6 +75,42 @@ devServer: {
7575
}
7676
```
7777

78+
### Parcel
79+
80+
Add the following to `.babelrc`:
81+
82+
```json
83+
{
84+
"env": {
85+
"development": {
86+
"presets": [
87+
["babel-preset-solid"]
88+
],
89+
"plugins": [
90+
["module:solid-refresh/babel"]
91+
]
92+
},
93+
"production": {
94+
"presets": [
95+
["babel-preset-solid"]
96+
],
97+
"plugins": [
98+
]
99+
}
100+
}
101+
}
102+
```
103+
104+
Parcel doesn't enable package exports by default, which allows loading the dev version of SolidJS. To enable it, the following must be added in `package.json` (in accordance with [this document](https://parceljs.org/features/dependency-resolution/#enabling-package-exports)):
105+
106+
```json
107+
{
108+
"@parcel/resolver-default": {
109+
"packageExports": true
110+
}
111+
}
112+
```
113+
78114
### Nollup
79115

80116
Requires the use of [`@rollup/plugin-babel`](https://www.npmjs.com/package/@rollup/plugin-babel). Add the following to `.babelrc`:
@@ -105,8 +141,6 @@ Requires the use of [`@snowpack/plugin-babel`](https://www.npmjs.com/package/@sn
105141

106142
### Other dev servers
107143

108-
* [`Parcel`](https://parceljs.org/)
109-
* ParcelJS doesn't support [conditional exports](https://nodejs.org/api/packages.html#conditional-exports) yet, which makes ParcelJS load the production build of SolidJS instead of its development build. Solid Refresh requires the SolidJS development build to work.
110144
* [`wmr`](https://wmr.dev/)
111145
* SolidJS is yet to be supported or isn't clear yet. It will use the same config as Snowpack.
112146
* [`rollup-plugin-hot`](https://github.com/rixo/rollup-plugin-hot)
@@ -157,15 +191,9 @@ Or force reload:
157191
/* @refresh reload */
158192
```
159193

160-
### `@refresh granular`
161-
162-
By default, components from the old module are replaced with the new ones from the replacement module, which might cause components that hasn't really changed to unmount abruptly.
163-
164-
Adding `@refresh granular` comment pragma in the file allows components to opt-in to granular replacement: If the component has changed *code-wise*, it will be replaced, otherwise, it will be retained, which allows unchanged ancestor components to preserve lifecycles.
165-
166194
## Limitations
167195

168-
* Preserving state: The default mode does not allow preserving state through module replacement. `@refresh granular` allows this partially.
196+
* Preserving state is applied partially.
169197
* No HOC support.
170198

171199
## Custom `render`/`createContext`

‎example.js‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import * as babel from '@babel/core';
2+
import plugin from 'solid-refresh/babel';
3+
import { readFile } from 'node:fs/promises';
4+
5+
async function compile(code) {
6+
const result = await babel.transformAsync(code, {
7+
plugins: [[plugin, { bundler: 'vite' }]],
8+
parserOpts: {
9+
plugins: ['jsx', 'typescript'],
10+
},
11+
filename: 'input.js',
12+
sourceFileName: 'input.js',
13+
sourceMaps: true,
14+
});
15+
16+
return result?.code ?? '';
17+
}
18+
19+
console.log(await compile(await readFile('./input.js', 'utf-8')));

‎input.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
function Example(props) {
2+
return (
3+
<h1>
4+
{props.greeting}, {props.receiver}!
5+
</h1>
6+
);
7+
}
8+
9+
const hello = <Example />;

‎playground/.babelrc‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
{
2+
"env": {
3+
"development": {
4+
"presets": [
5+
["babel-preset-solid"]
6+
],
7+
"plugins": [
8+
["module:solid-refresh/babel"]
9+
]
10+
},
11+
"production": {
12+
"presets": [
13+
["babel-preset-solid"]
14+
],
15+
"plugins": [
16+
]
17+
}
18+
}
19+
}

‎playground/.gitignore‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
node_modules
2+
dist
3+
.parcel-cache

‎playground/package.json‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"name": "solid-parcel-template",
3+
"source": "src/index.html",
4+
"scripts": {
5+
"start": "parcel",
6+
"build": "parcel build"
7+
},
8+
"dependencies": {
9+
"solid-js": "link:../node_modules/solid-js"
10+
},
11+
"devDependencies": {
12+
"@babel/core": "link:../node_modules/@babel/core",
13+
"babel-preset-solid": "link:../node_modules/babel-preset-solid",
14+
"parcel": "^2.11.0",
15+
"solid-refresh": "link:.."
16+
},
17+
"@parcel/resolver-default": {
18+
"packageExports": true
19+
}
20+
}

0 commit comments

Comments
 (0)