test astro
This commit is contained in:
commit
bd93770e35
7
.gitignore
vendored
Normal file
7
.gitignore
vendored
Normal file
@ -0,0 +1,7 @@
|
||||
node_modules
|
||||
.DS_Store
|
||||
|
||||
.astro
|
||||
|
||||
dist
|
||||
|
14
astro.config.mjs
Normal file
14
astro.config.mjs
Normal file
@ -0,0 +1,14 @@
|
||||
import { defineConfig } from 'astro/config';
|
||||
import mdx from '@astrojs/mdx';
|
||||
import react from '@astrojs/react';
|
||||
|
||||
import tailwindcss from '@tailwindcss/vite';
|
||||
|
||||
export default defineConfig({
|
||||
// ...
|
||||
integrations: [mdx(), react()],
|
||||
|
||||
vite: {
|
||||
plugins: [tailwindcss()],
|
||||
},
|
||||
});
|
33
package.json
Normal file
33
package.json
Normal file
@ -0,0 +1,33 @@
|
||||
{
|
||||
"name": "test-astro",
|
||||
"version": "0.0.1",
|
||||
"description": "",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
"dev": "astro dev",
|
||||
"build": "astro build",
|
||||
"preview": "astro preview"
|
||||
},
|
||||
"keywords": [],
|
||||
"author": "abearxiong <xiongxiao@xiongxiao.me> (https://www.xiongxiao.me)",
|
||||
"license": "MIT",
|
||||
"packageManager": "pnpm@10.6.2",
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"@astrojs/mdx": "^4.2.5",
|
||||
"@astrojs/react": "^4.2.5",
|
||||
"@kevisual/query": "^0.0.17",
|
||||
"@tailwindcss/vite": "^4.1.4",
|
||||
"astro": "^5.7.5",
|
||||
"clsx": "^2.1.1",
|
||||
"react": "^19.1.0",
|
||||
"react-dom": "^19.1.0",
|
||||
"react-toastify": "^11.0.5",
|
||||
"tailwindcss": "^4.1.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@kevisual/types": "^0.0.7",
|
||||
"@types/react": "^19.1.2",
|
||||
"@types/react-dom": "^19.1.2"
|
||||
}
|
||||
}
|
4650
pnpm-lock.yaml
generated
Normal file
4650
pnpm-lock.yaml
generated
Normal file
File diff suppressed because it is too large
Load Diff
14
src/components/Test.tsx
Normal file
14
src/components/Test.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { useEffect } from 'react';
|
||||
import { query } from '../modules/query';
|
||||
export const Test = () => {
|
||||
useEffect(() => {
|
||||
// This is a test to see if the component is working
|
||||
console.log('query', query);
|
||||
}, []);
|
||||
return (
|
||||
<div>
|
||||
<h1>Test</h1>
|
||||
<p>This is a test component.</p>
|
||||
</div>
|
||||
);
|
||||
};
|
5
src/modules/query.ts
Normal file
5
src/modules/query.ts
Normal file
@ -0,0 +1,5 @@
|
||||
// import { QueryClient } from '@kevisual/query';
|
||||
import { QueryClient } from 'https://esm.sh/@kevisual/query';
|
||||
|
||||
export const query = new QueryClient();
|
||||
console.log('Query client initialized', query);
|
49
src/pages/index.astro
Normal file
49
src/pages/index.astro
Normal file
@ -0,0 +1,49 @@
|
||||
---
|
||||
// import { query } from '@/modules/query.ts';
|
||||
console.log('Hello from index.astro');
|
||||
import { Test } from '@/components/Test.tsx';
|
||||
import '../styles/global.css';
|
||||
---
|
||||
|
||||
<html lang='en'>
|
||||
<head>
|
||||
<title>My Homepage</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Welcome to my website!</h1>
|
||||
<div class='bg-amber-50 w-20 h-20 rounded-full'></div>
|
||||
<div id='root'></div>
|
||||
<Test client:only />
|
||||
<script type='importmap' data-vite-ignore is:inline>
|
||||
{
|
||||
"imports": {
|
||||
"react": "https://esm.sh/react@19.1.0",
|
||||
"react-dom": "https://esm.sh/react-dom@19.1.0/client.js",
|
||||
"react-toastify": "https://esm.sh/react-toastify@11.0.5"
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<script type='module' data-vite-ignore is:inline>
|
||||
import { Button, message } from 'https://esm.sh/antd?standalone';
|
||||
import React from 'react';
|
||||
import { ToastContainer, toast } from 'react-toastify';
|
||||
import { createRoot } from 'react-dom';
|
||||
setTimeout(() => {
|
||||
toast.loading('Hello from index.astro');
|
||||
window.toast = toast;
|
||||
console.log('message', toast);
|
||||
}, 1000);
|
||||
console.log('Hello from index.astro', Button);
|
||||
const root = document.getElementById('root');
|
||||
const render = createRoot(root);
|
||||
const App = () => {
|
||||
const button = React.createElement(Button, null, 'Hello');
|
||||
const messageEl = React.createElement(ToastContainer, null, 'Hello');
|
||||
const wrapperMessage = React.createElement('div', null, [button, messageEl]);
|
||||
return wrapperMessage;
|
||||
};
|
||||
// render.render(React.createElement(Button, null, 'Hello'), root);
|
||||
render.render(App(), root);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
8
src/pages/posts/post-1.mdx
Normal file
8
src/pages/posts/post-1.mdx
Normal file
@ -0,0 +1,8 @@
|
||||
---
|
||||
title: 'My first MDX post'
|
||||
author: 'test'
|
||||
---
|
||||
|
||||
# {frontmatter.title}
|
||||
|
||||
Written by: {frontmatter.author}
|
1
src/styles/global.css
Normal file
1
src/styles/global.css
Normal file
@ -0,0 +1 @@
|
||||
@import 'tailwindcss';
|
17
tsconfig.json
Normal file
17
tsconfig.json
Normal file
@ -0,0 +1,17 @@
|
||||
{
|
||||
"extends": "@kevisual/types/json/frontend.json",
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"typeRoots": [
|
||||
"node_modules/@types",
|
||||
],
|
||||
"paths": {
|
||||
"@/*": [
|
||||
"./src/*"
|
||||
]
|
||||
},
|
||||
},
|
||||
"include": [
|
||||
"src/**/*",
|
||||
],
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user