Skip to content

Commit 8256a47

Browse files
authored
Merge pull request #5 from firtadokei/dev
Fix frameworks examples
2 parents 60c4e26 + 78bf7ec commit 8256a47

File tree

11 files changed

+230
-15
lines changed

11 files changed

+230
-15
lines changed

src/Commands/Remove.php

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,9 @@ private function removeFrameworkFiles()
4646
# package.json
4747
is_file(ROOTPATH . 'package.json') ? unlink(ROOTPATH . 'package.json') : CLI::error('package.json does not exist');
4848

49+
# Remove package-lock.json
50+
is_file(ROOTPATH . 'package-lock.json') ? unlink(ROOTPATH . 'package-lock.json') : CLI::error('package-lock.json does not exist');
51+
4952
# Empty resources dir.
5053
if (is_dir(ROOTPATH . 'resources'))
5154
{

src/Config/react/resources/App.jsx

Lines changed: 18 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,23 @@
1-
1+
import { useState } from 'react'
2+
import reactLogo from '@/react.svg'
23

34
function App() {
4-
5-
return (
6-
<div className="App">
7-
eelcome to reactsssssssssssssssssssss
8-
sa
9-
</div>
10-
)
5+
const [count, setCount] = useState(0)
6+
return (
7+
<div className="App">
8+
<div className="logos">
9+
<img src="https://github.com/firtadokei/codeigniter-vitejs/raw/master/src/logo.png" className="logo" alt="Codeigniter vite logo" />
10+
<img src={reactLogo} className="logo" alt="React logo" />
11+
</div>
12+
<h2>Codeigniter Vite + React</h2>
13+
<p>
14+
<button onClick={() => setCount((count) => count + 1)}>
15+
count is {count}
16+
</button>
17+
</p>
18+
<p>Edit resources/App.jsx and save to test HMR</p>
19+
</div>
20+
)
1121
}
1222

1323
export default App

src/Config/react/resources/main.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from 'react'
22
import ReactDOM from 'react-dom/client'
33
import App from './App'
4-
import './index.css'
4+
import '@/style.css'
55

66
ReactDOM.createRoot(document.getElementById('app')).render(
77
<React.StrictMode>
Lines changed: 1 addition & 0 deletions
Loading
Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
:root {
2+
font-family: Helvetica,
3+
Arial,
4+
sans-serif;
5+
font-size: 16px;
6+
line-height: 24px;
7+
font-weight: 400;
8+
color-scheme: light
9+
dark;
10+
color: rgba(
11+
255,
12+
255,
13+
255,
14+
0.87
15+
);
16+
background-color: #242424;
17+
text-rendering: optimizeLegibility;
18+
}
19+
20+
body {
21+
margin: 0;
22+
display: flex;
23+
place-items: center;
24+
min-width: 320px;
25+
min-height: 100vh;
26+
}
27+
28+
#app {
29+
max-width: 1280px;
30+
margin: 0
31+
auto;
32+
padding: 2rem;
33+
text-align: center;
34+
}
35+
36+
.logo {
37+
height: 6em;
38+
margin-inline: 10px;
39+
}
40+
41+
button {
42+
padding: 10px
43+
15px;
44+
border: 1px
45+
solid
46+
#6f6f6f;
47+
border-radius: 11px;
48+
cursor: pointer;
49+
}
50+
51+
p {
52+
margin-block: 25px;
53+
}
Lines changed: 43 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,49 @@
1+
<script>
2+
import svelteLogo from "@/svelte.svg";
3+
4+
let count = 0;
5+
const increment =
6+
() => {
7+
count += 1;
8+
};
9+
</script>
110

211
<main>
3-
Codeigniter-vite Svelte
12+
<div
13+
class="container">
14+
<div
15+
class="logos">
16+
<img
17+
src="https://github.com/firtadokei/codeigniter-vitejs/raw/master/src/logo.png"
18+
class="logo"
19+
alt="Codeigniter vite logo" />
20+
<img
21+
src={svelteLogo}
22+
class="logo"
23+
alt="Svelte logo" />
24+
</div>
25+
<h2>
26+
Codeigniter
27+
Vite
28+
+
29+
Svelte
30+
</h2>
31+
<p>
32+
<button
33+
on:click={increment}
34+
>Count
35+
is
36+
{count}</button>
37+
</p>
38+
<p>
39+
Edit
40+
resources/App.svelte
41+
to
42+
test
43+
HMR
44+
</p>
45+
</div>
446
</main>
547

648
<style>
7-
849
</style>
Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
:root {
2+
font-family: Helvetica,
3+
Arial,
4+
sans-serif;
5+
font-size: 16px;
6+
line-height: 24px;
7+
font-weight: 400;
8+
color-scheme: light
9+
dark;
10+
color: rgba(
11+
255,
12+
255,
13+
255,
14+
0.87
15+
);
16+
background-color: #242424;
17+
text-rendering: optimizeLegibility;
18+
}
19+
20+
body {
21+
margin: 0;
22+
display: flex;
23+
place-items: center;
24+
min-width: 320px;
25+
min-height: 100vh;
26+
}
27+
28+
#app {
29+
max-width: 1280px;
30+
margin: 0
31+
auto;
32+
padding: 2rem;
33+
text-align: center;
34+
}
35+
36+
.logo {
37+
height: 6em;
38+
margin-inline: 10px;
39+
}
40+
41+
button {
42+
padding: 10px
43+
15px;
44+
border: 1px
45+
solid#6f6f6f;
46+
border-radius: 11px;
47+
cursor: pointer;
48+
}
49+
50+
p {
51+
margin-block: 25px;
52+
}

src/Config/svelte/resources/main.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import './app.css'
12
import App from './App.svelte'
23

34
const app = new App({

src/Config/vue/resources/App.vue

Lines changed: 57 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,64 @@
1+
<script setup>
2+
import { ref } from 'vue';
3+
4+
const count = ref(0)
5+
</script>
16
<template>
2-
<div class="main">
3-
<p>Codeigniter4 + VueJs + ViteJs</p>
7+
<div class="container">
8+
<div class="logos">
9+
<img src="https://github.com/firtadokei/codeigniter-vitejs/raw/master/src/logo.png" class="logo" alt="Codeigniter vite logo" />
10+
<img src="@/vue.svg" class="logo" alt="Vue logo" />
11+
</div>
12+
<h2>Codeigniter Vite + Vue</h2>
13+
<p>
14+
<button @click="count++">You click me {{ count }} times</button>
15+
</p>
16+
<p>
17+
Edit resources/App.vue to test HMR
18+
</p>
419
</div>
520
</template>
621

7-
<style scoped>
8-
.main {
22+
<style>
23+
:root {
24+
font-family: Helvetica, Arial, sans-serif;
25+
font-size: 16px;
26+
line-height: 24px;
27+
font-weight: 400;
28+
color-scheme: light dark;
29+
color: rgba(255, 255, 255, 0.87);
30+
background-color: #242424;
31+
text-rendering: optimizeLegibility;
32+
}
33+
34+
body {
35+
margin: 0;
36+
display: flex;
37+
place-items: center;
38+
min-width: 320px;
39+
min-height: 100vh;
40+
}
41+
42+
#app {
43+
max-width: 1280px;
44+
margin: 0 auto;
45+
padding: 2rem;
946
text-align: center;
1047
}
48+
49+
.logo {
50+
height: 6em;
51+
margin-inline: 10px;
52+
}
53+
54+
button {
55+
padding: 10px 15px;
56+
border: 1px solid #6f6f6f;
57+
border-radius: 11px;
58+
cursor: pointer;
59+
}
60+
61+
p {
62+
margin-block: 25px;
63+
}
1164
</style>

0 commit comments

Comments
 (0)