KernelDeimos
3 years ago
parent
79c7581402
commit
9c22bc28e5
@ -0,0 +1,11 @@
|
|||||||
|
{
|
||||||
|
"plugins": [
|
||||||
|
[
|
||||||
|
"@babel/plugin-transform-react-jsx",
|
||||||
|
{
|
||||||
|
"pragma": "justact.createElement"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
],
|
||||||
|
"comments": false
|
||||||
|
}
|
||||||
@ -0,0 +1,18 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||||
|
<title>Test</title>
|
||||||
|
<style>
|
||||||
|
BODY {
|
||||||
|
background-color: #222;
|
||||||
|
color: #eee;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,28 @@
|
|||||||
|
{
|
||||||
|
"name": "justact-test",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"description": "Manual test app for justact",
|
||||||
|
"main": "index.js",
|
||||||
|
"type": "module",
|
||||||
|
"scripts": {
|
||||||
|
"test": "echo \"Error: no test specified\" && exit 1",
|
||||||
|
"build-babel": "babel src -d dist",
|
||||||
|
"build-webpack": "webpack --config webpack.config.js",
|
||||||
|
"build": "npm run build-babel && npm run build-webpack"
|
||||||
|
},
|
||||||
|
"workspaces": [
|
||||||
|
"../../"
|
||||||
|
],
|
||||||
|
"author": "Coherent Constructs",
|
||||||
|
"license": "MIT",
|
||||||
|
"devDependencies": {
|
||||||
|
"@babel/cli": "^7.20.7",
|
||||||
|
"@babel/core": "^7.20.12",
|
||||||
|
"@babel/plugin-transform-modules-umd": "^7.18.6",
|
||||||
|
"@babel/plugin-transform-react-jsx": "^7.20.13",
|
||||||
|
"babel-loader": "^9.1.2",
|
||||||
|
"html-webpack-plugin": "^5.5.0",
|
||||||
|
"webpack": "^5.75.0",
|
||||||
|
"webpack-cli": "^5.0.1"
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,39 @@
|
|||||||
|
// const justact = require('justact');
|
||||||
|
import * as justact from 'justact';
|
||||||
|
|
||||||
|
class InputMultiplex extends justact.Component {
|
||||||
|
render () {
|
||||||
|
console.log('InputMultiplex', this);
|
||||||
|
return this.swap ? (
|
||||||
|
<input value={this.valueB$} type="text" />
|
||||||
|
) : (
|
||||||
|
<input value={this.valueA$} type="text" />
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
class App extends justact.Component {
|
||||||
|
render () {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<input type="checkbox" value={this.swap$} />
|
||||||
|
<InputMultiplex swap={this.swap$}></InputMultiplex>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// TODO: This should be a single function call;
|
||||||
|
// maybe like: justact.append(document.body, new App())
|
||||||
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
const root = new App({});
|
||||||
|
const elements = root.createElements();
|
||||||
|
|
||||||
|
console.log('app', root);
|
||||||
|
|
||||||
|
for ( const element of elements ) {
|
||||||
|
document.body.append(element);
|
||||||
|
}
|
||||||
|
|
||||||
|
root.notifyMounted({ parent: document.body });
|
||||||
|
});
|
||||||
@ -0,0 +1,44 @@
|
|||||||
|
import * as url from 'url';
|
||||||
|
const __filename = url.fileURLToPath(import.meta.url);
|
||||||
|
const __dirname = url.fileURLToPath(new URL('.', import.meta.url));
|
||||||
|
|
||||||
|
// const HtmlWebpackPlugin = require("html-webpack-plugin");
|
||||||
|
|
||||||
|
import HtmlWebpackPlugin from 'html-webpack-plugin';
|
||||||
|
|
||||||
|
const config = {
|
||||||
|
entry: "./src/index.jsx",
|
||||||
|
mode: "development",
|
||||||
|
output: {
|
||||||
|
path: `${__dirname}/build`,
|
||||||
|
filename: "bundle.js",
|
||||||
|
},
|
||||||
|
plugins: [
|
||||||
|
new HtmlWebpackPlugin({
|
||||||
|
template: "index.html",
|
||||||
|
}),
|
||||||
|
],
|
||||||
|
module: {
|
||||||
|
rules: [
|
||||||
|
{
|
||||||
|
test: /\.(js|jsx)$/,
|
||||||
|
exclude: /node_modules/,
|
||||||
|
use: {
|
||||||
|
loader: 'babel-loader',
|
||||||
|
options: {
|
||||||
|
plugins: [
|
||||||
|
[
|
||||||
|
'@babel/plugin-transform-react-jsx',
|
||||||
|
{
|
||||||
|
"pragma": "justact.createElement"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
export default config;
|
||||||
Loading…
Reference in new issue