tudisco/parcel-transformer-riot
1
0
Fork 0
Code Issues Pull Requests Projects Releases 1 Wiki Activity

Add support for parcel v2

Browse Source
This commit is contained in:
gianlucaguarini 2021-10-16 16:17:12 +02:00
parent ab2416bab6
commit 08e9c11480
9 changed files with 2812 additions and 16160 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@ -1,4 +1,5 @@
node_modules node_modules
/test/.parcel-cache/
/test/package-lock.json /test/package-lock.json
/test/dist /test/dist
.idea .idea

46
RiotAsset.js
View File

@ -1,46 +0,0 @@
const { compile } = require('@riotjs/compiler')
const { Asset } = require('parcel-bundler')
const { relative, dirname } = require('path')
/**
* Generate the hmr code depending on the tag generated by the compiler
* @param {string} path - path to the component file
* @returns {string} the code needed to handle the riot hot reload
*/
function hotReload(path) {
return `;(() => {
if (module.hot) {
const hotReload = require('@riotjs/hot-reload').default
module.hot.accept()
if (module.hot.data) {
const component = require('./${path}').default;
hotReload(component)
}
}
})()`
}
class RiotAsset extends Asset {
constructor(name, pkg, options) {
super(name, pkg, options)
this.type = 'js'
}
async generate() {
const options = (await this.getConfig(['.riotrc', '.riotrc.js', 'riot.config.js'])) || {}
const {code, map} = compile(this.contents, {
file: this.relativeName,
...options
})
return [
{
sourceMap: this.options.sourceMaps ? map : false,
type: 'js',
value: `${code}${options.hot ? hotReload(relative(dirname(this.name), this.relativeName)) : ''}`
}
]
}
}
module.exports = RiotAsset

55
index.js
View File

@ -1,3 +1,54 @@
module.exports = function(bundler) { const { compile } = require('@riotjs/compiler')
bundler.addAssetType('riot', require.resolve('./RiotAsset')) const { Transformer } = require('@parcel/plugin')
const SourceMap = require('@parcel/source-map').default
const { relative } = require('path')
/**
* Generate the hmr code depending on the tag generated by the compiler
* @param {string} path - path to the component file
* @returns {string} the code needed to handle the riot hot reload
*/
function hotReload(path) {
return `;(() => {
if (module.hot) {
const hotReload = require('@riotjs/hot-reload').default
module.hot.accept()
if (module.hot.data) {
const component = require('./${path}').default;
hotReload(component)
}
}
})()`
} }
module.exports = new Transformer({
async loadConfig({config}) {
const { contents } = await config.getConfig(
['.riotrc', '.riotrc.js', 'riot.config.js'],
{
packageKey: 'riot'
}
)
return contents || {}
},
async transform({asset, config, options}) {
const source = await asset.getCode()
const sourceMap = new SourceMap(options.projectRoot)
const {code, map} = compile(source, {
file: asset.filePath,
...config
})
asset.type = 'js'
asset.setCode(`${code}${config.hot ? hotReload(relative(options.projectRoot, asset.filePath)) : ''}`)
asset.setMap(sourceMap.addVLQMap(map))
return [asset]
}
})

18835
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

12
package.json
View File

@ -1,5 +1,5 @@
{ {
"name": "@riotjs/parcel-plugin-riot", "name": "@riotjs/parcel-transformer-riot",
"version": "6.0.0", "version": "6.0.0",
"description": "A parcel plugin for riot.js", "description": "A parcel plugin for riot.js",
"main": "index.js", "main": "index.js",
@ -8,17 +8,23 @@
"test": "npx eslint *.js && npm run test-bundle", "test": "npx eslint *.js && npm run test-bundle",
"test-bundle": "cd test && npm i" "test-bundle": "cd test && npm i"
}, },
"engines": {
"parcel": "2.x"
},
"license": "MIT", "license": "MIT",
"repository": { "repository": {
"type": "git", "type": "git",
"url": "https://github.com/andruschka/parcel-plugin-riot" "url": "https://github.com/andruschka/parcel-plugin-riot"
}, },
"peerDependencies": { "peerDependencies": {
"@riotjs/compiler": "^6.0.0", "@riotjs/compiler": "^6.0.0"
"parcel-bundler": "^1.9.4"
}, },
"devDependencies": { "devDependencies": {
"eslint": "^7.30.0", "eslint": "^7.30.0",
"eslint-config-riot": "^3.0.0" "eslint-config-riot": "^3.0.0"
},
"dependencies": {
"@parcel/plugin": "^2.0.0",
"@parcel/source-map": "^2.0.0"
} }
} }

6
test/.parcelrc Normal file
View File

@ -0,0 +1,6 @@
{
"extends": "@parcel/config-default",
"transformers": {
"*.riot": ["@riotjs/parcel-transformer-riot"]
}
}

2
test/index.html
View File

@ -8,6 +8,6 @@
</head> </head>
<body> <body>
<div id="root"></div> <div id="root"></div>
<script src="./main.js"></script> <script type="module" src="./main.js"></script>
</body> </body>
</html> </html>

4
test/main.js
View File

@ -1,3 +1,5 @@
import { component } from 'riot'
import MyComponent from './my-component.riot' import MyComponent from './my-component.riot'
export default MyComponent
component(MyComponent)(document.getElementById('root'))

11
test/package.json
View File

@ -1,17 +1,16 @@
{ {
"name": "riot-parcel-test", "name": "riot-parcel-test",
"main": "index.html",
"private": true, "private": true,
"scripts": { "scripts": {
"postinstall": "parcel build index.html --no-cache" "postinstall": "parcel build index.html --no-cache"
}, },
"dependencies": { "dependencies": {
"parcel-bundler": "^1.11.0" "parcel": "^2.0.0"
}, },
"devDependencies": { "devDependencies": {
"@riotjs/compiler": "^4.0.0", "@riotjs/compiler": "^6.0.0",
"@riotjs/hot-reload": "^4.0.0-rc.1", "@riotjs/hot-reload": "^6.0.0",
"@riotjs/parcel-plugin-riot": "file:../", "@riotjs/parcel-transformer-riot": "file:../",
"riot": "^4.0.0-rc.13" "riot": "^6.0.0"
} }
} }