Combine multiple entry points into one
This commit is contained in:
parent
f55b497405
commit
92dce509af
11 changed files with 63 additions and 112 deletions
|
|
@ -1,4 +1,5 @@
|
|||
-stage/
|
||||
-node_modules/
|
||||
-.gems/
|
||||
-/twenty-client/tmp/
|
||||
-/client/tmp/
|
||||
-/client/build/
|
||||
|
|
|
|||
|
|
@ -23,8 +23,7 @@ def require_rules(rules, locals = {}, target = binding)
|
|||
end
|
||||
|
||||
require_rules "nanoc/rules/assets"
|
||||
require_rules "nanoc/rules/projects"
|
||||
require_rules "nanoc/rules/tasks"
|
||||
require_rules "nanoc/rules/react"
|
||||
|
||||
compile("/**/*") { write(nil) }
|
||||
layout "/**/*", :erb
|
||||
|
|
|
|||
|
|
@ -1,15 +0,0 @@
|
|||
#!/usr/bin/env ruby
|
||||
|
||||
##
|
||||
# GET /
|
||||
compile '/html/react.html.erb', rep: "projects/index" do
|
||||
filter(:erb, locals: {src: "/js/main/projects.js"})
|
||||
write('/projects/index.html')
|
||||
end
|
||||
|
||||
##
|
||||
# GET /js/main/projects.js
|
||||
compile("/js/main/projects.tsx") do
|
||||
filter(:webpack, depend_on: %w[/js/components/ /js/hooks/ /js/types/])
|
||||
write("/js/main/projects.js")
|
||||
end
|
||||
20
client/nanoc/rules/react.rules
Normal file
20
client/nanoc/rules/react.rules
Normal file
|
|
@ -0,0 +1,20 @@
|
|||
#!/usr/bin/env ruby
|
||||
|
||||
components = {
|
||||
'react-newtask' => 'tasks/new',
|
||||
'react-edittask' => 'tasks/edit',
|
||||
'react-tasks' => 'tasks',
|
||||
'react-projects' => 'projects'
|
||||
}
|
||||
|
||||
components.each do |name, path|
|
||||
compile '/html/react.html.erb', rep: name do
|
||||
filter(:erb, locals: {name:, path: "/#{path}", src: "/js/main.js"})
|
||||
write("/#{path}/index.html")
|
||||
end
|
||||
end
|
||||
|
||||
compile "/js/main/main.tsx" do
|
||||
filter(:webpack, depend_on: %w[/js/components/ /js/hooks/ /js/types/])
|
||||
write("/js/main.js")
|
||||
end
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
#!/usr/bin/env ruby
|
||||
|
||||
##
|
||||
# GET /tasks/new/
|
||||
compile '/html/react.html.erb', rep: "tasks/new" do
|
||||
filter(:erb, locals: {src: "/js/main/task/new.js"})
|
||||
write("/tasks/new/index.html")
|
||||
end
|
||||
|
||||
##
|
||||
# GET /js/main/task/new.js
|
||||
compile("/js/main/task/new.tsx") do
|
||||
filter(:webpack, depend_on: %w[/js/lib/ /js/components/ /js/hooks/ /js/types/])
|
||||
write("/js/main/task/new.js")
|
||||
end
|
||||
|
||||
##
|
||||
# GET /
|
||||
# GET /tasks/
|
||||
compile("/html/react.html.erb", rep: "tasks/index") do
|
||||
filter(:erb, locals: {src: "/js/main/tasks.js"})
|
||||
write("/tasks/index.html")
|
||||
write("/index.html")
|
||||
end
|
||||
|
||||
##
|
||||
# GET /js/main/tasks.js
|
||||
compile("/js/main/tasks.tsx") do
|
||||
filter(:webpack, depend_on: %w[/js/lib/ /js/components /js/hooks/ /js/types/])
|
||||
write("/js/main/tasks.js")
|
||||
end
|
||||
|
||||
##
|
||||
# GET /tasks/edit#id=X
|
||||
compile("/html/react.html.erb") do
|
||||
filter(:erb, locals: {src: '/js/main/task/edit.js'})
|
||||
write("/tasks/edit/index.html")
|
||||
end
|
||||
|
||||
##
|
||||
# GET /js/main/task/edit.js
|
||||
compile("/js/main/task/edit.tsx") do
|
||||
filter(:webpack, depend_on: %w[/js/lib/ /js/components /js/hooks/ /js/types/])
|
||||
write("/js/main/task/edit.js")
|
||||
end
|
||||
|
|
@ -7,7 +7,7 @@
|
|||
<link rel="icon" href="/favicon.svg"/>
|
||||
</head>
|
||||
<body>
|
||||
<div class="react-root w-full wrapper"></div>
|
||||
<div class="<%= name %> w-full wrapper"></div>
|
||||
<script src="<%= src %>"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
39
client/src/js/main/main.tsx
Normal file
39
client/src/js/main/main.tsx
Normal file
|
|
@ -0,0 +1,39 @@
|
|||
import React from "react";
|
||||
import ReactDOM from "react-dom/client";
|
||||
import { App } from "~/components/App";
|
||||
import { Tasks } from "~/components/Tasks";
|
||||
import { Projects } from "~/components/Projects";
|
||||
import { Task } from "~/components/Task";
|
||||
|
||||
(function () {
|
||||
const components = {
|
||||
"react-newtask": (
|
||||
<App>
|
||||
<Task />
|
||||
</App>
|
||||
),
|
||||
"react-edittask": (
|
||||
<App>
|
||||
<Task />
|
||||
</App>
|
||||
),
|
||||
"react-tasks": (
|
||||
<App>
|
||||
<Tasks />
|
||||
</App>
|
||||
),
|
||||
"react-projects": (
|
||||
<App>
|
||||
<Projects />
|
||||
</App>
|
||||
)
|
||||
};
|
||||
Object
|
||||
.entries(components)
|
||||
.forEach(([name, jsx]) => {
|
||||
const root = document.querySelector(`.${name}`);
|
||||
if (root) {
|
||||
ReactDOM.createRoot(root).render(jsx);
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
import ReactDOM from "react-dom/client";
|
||||
import { App } from "~/components/App";
|
||||
import { Projects } from "~/components/Projects";
|
||||
|
||||
(function () {
|
||||
const root = document.querySelector(".react-root")!;
|
||||
ReactDOM.createRoot(root).render(
|
||||
<App>
|
||||
<Projects />
|
||||
</App>,
|
||||
);
|
||||
})();
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
import ReactDOM from "react-dom/client";
|
||||
import { App } from "~/components/App";
|
||||
import { Task } from "~/components/Task";
|
||||
|
||||
(function () {
|
||||
const root = document.querySelector(".react-root")!;
|
||||
ReactDOM.createRoot(root).render(
|
||||
<App>
|
||||
<Task />
|
||||
</App>,
|
||||
);
|
||||
})();
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
import ReactDOM from "react-dom/client";
|
||||
import { App } from "~/components/App";
|
||||
import { Task } from "~/components/Task";
|
||||
|
||||
(function () {
|
||||
const root = document.querySelector(".react-root")!;
|
||||
ReactDOM.createRoot(root).render(
|
||||
<App>
|
||||
<Task />
|
||||
</App>,
|
||||
);
|
||||
})();
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
import ReactDOM from "react-dom/client";
|
||||
import { App } from "~/components/App";
|
||||
import { Tasks } from "~/components/Tasks";
|
||||
|
||||
(function () {
|
||||
const root = document.querySelector(".react-root")!;
|
||||
ReactDOM.createRoot(root).render(
|
||||
<App>
|
||||
<Tasks />
|
||||
</App>,
|
||||
);
|
||||
})();
|
||||
Loading…
Reference in a new issue