master
yutent 2023-04-20 18:59:36 +08:00
parent 03b3e2c608
commit 39423d7533
2 changed files with 104 additions and 21 deletions

View File

@ -57,7 +57,7 @@ function isEmpty(dir) {
return true return true
} }
function getVueLiveVersion() { function getFiteVersion() {
return new Promise(yes => { return new Promise(yes => {
request('https://registry.npmmirror.com/fite', res => { request('https://registry.npmmirror.com/fite', res => {
let data = '' let data = ''
@ -145,14 +145,14 @@ function sleep(num = 1) {
console.log(cyan('\n初始化项目...')) console.log(cyan('\n初始化项目...'))
let vueLiveVer = await getVueLiveVersion() let fiteVerion = await getFiteVersion()
fs.mkdir(join(targetDir, 'src')) fs.mkdir(join(targetDir, 'src'))
console.log('[c---------]', '10%') console.log('[c---------]', '10%')
writePackageJson(join(targetDir, 'package.json'), res.projectName, vueLiveVer) writePackageJson(join(targetDir, 'package.json'), res.projectName, fiteVerion)
writeConfigFile(join(targetDir, 'vue.live.js')) writeConfigFile(join(targetDir, 'fite.config.js'))
writeGitIgnore(join(targetDir, '.gitignore')) writeGitIgnore(join(targetDir, '.gitignore'))
writePrettierrc(join(targetDir, '.prettierrc.yaml')) writePrettierrc(join(targetDir, '.prettierrc.yaml'))
@ -165,13 +165,28 @@ function sleep(num = 1) {
console.log('[oooooc----]', '60%') console.log('[oooooc----]', '60%')
writeMainJs(join(targetDir, 'src/main.js')) if (res.isSPA) {
writeAppVue(join(targetDir, 'src/app.vue')) writeMainJs(join(targetDir, 'src/main.js'))
writeHomeVue(join(targetDir, 'src/views/home.vue')) writeAppVue(join(targetDir, 'src/app.vue'))
writeAboutVue(join(targetDir, 'src/views/about.vue')) writeHomeVue(join(targetDir, 'src/views/home.vue'))
writeHelloVue(join(targetDir, 'src/components/hello.vue')) writeAboutVue(join(targetDir, 'src/views/about.vue'))
writeRouter(join(targetDir, 'src/router.js')) writeHelloVue(join(targetDir, 'src/components/hello.vue'))
writeStore(join(targetDir, 'src/store.js'), vueLiveVer) writeRouter(join(targetDir, 'src/router.js'))
writeStore(join(targetDir, 'src/store.js'), fiteVerion)
} else {
// index page
writeMainJs(join(targetDir, 'src/pages/index/main.js'))
writeAppVue(join(targetDir, 'src/pages/index/app.vue'))
writeHomeVue(join(targetDir, 'src/pages/index/views/home.vue'))
writeAboutVue(join(targetDir, 'src/pages/index/views/about.vue'))
writeHelloVue(join(targetDir, 'src/pages/index/components/hello.vue'))
writeRouter(join(targetDir, 'src/pages/index/router.js'))
writeStore(join(targetDir, 'src/pages/index/store.js'), fiteVerion)
// demo page
writeMainJs(join(targetDir, 'src/pages/demo/main.js', true))
writeAppVue(join(targetDir, 'src/pages/demo/app.vue', true))
}
console.log('[oooooooooo]', '100%') console.log('[oooooooooo]', '100%')
console.log(cyan('初始化完成, 可依次执行以下命令启动项目: ')) console.log(cyan('初始化完成, 可依次执行以下命令启动项目: '))

View File

@ -6,18 +6,24 @@
import fs from 'iofs' import fs from 'iofs'
export function writeMainJs(file) { export function writeMainJs(file, demo) {
fs.echo( fs.echo(
` `
import { createApp } from 'vue' import { createApp } from 'vue'
import App from './app.vue' import App from './app.vue'
import router from './router'
import store from './store' import store from './store'
${demo ? '' : `import router from './router'`}
const app = createApp(App) const app = createApp(App)
app.use(router).use(store).mount('.app') ${
demo
? `app.use(store).mount('.app')`
: `app.use(router).use(store).mount('.app')`
}
`, `,
file file
@ -72,9 +78,70 @@ export default function (app) {
) )
} }
export function writeAppVue(file) { export function writeAppVue(file, demo) {
fs.echo( if (demo) {
` fs.echo(
`<template>
<header>
<img alt="Vue logo" class="logo" src="/assets/logo.svg" width="125" height="125" />
<div class="wrapper">
<Hello msg="It works!!!" />
</div>
</header>
<router-view />
</template>
<script>
import Hello from '@/components/hello.vue'
export default {
components: { Hello }
}
</script>
<style lang="scss">
.app {
padding: 16px;
}
header {
display: flex;
flex-direction: column;
align-items: center;
}
a {
color: var(--color-teal-1);
transition: 0.2s;
}
a:hover {
color: var(--color-teal-3);
}
nav {
margin-top: 32px;
display: flex;
justify-content: center;
a {
margin: 0 16px;
}
}
main {
margin: 32px;
text-align: center;
}
</style>
`,
file
)
} else {
fs.echo(
`
<template> <template>
<header> <header>
<img alt="Vue logo" class="logo" src="/assets/logo.svg" width="125" height="125" /> <img alt="Vue logo" class="logo" src="/assets/logo.svg" width="125" height="125" />
@ -138,8 +205,9 @@ main {
`, `,
file file
) )
}
} }
export function writeHelloVue(file) { export function writeHelloVue(file) {
@ -150,7 +218,7 @@ export function writeHelloVue(file) {
<h1 class="green">{{ msg }}</h1> <h1 class="green">{{ msg }}</h1>
<h3> <h3>
你已经成功运行了一个项目, 项目基于 你已经成功运行了一个项目, 项目基于
<a href="//github.com/bytedo/vue-live" target="_blank">Vue-live</a> + <a href="//github.com/bytedo/fite" target="_blank">Fite</a> +
<a href="//vuejs.org" target="_blank">Vue 3</a>. <a href="//vuejs.org" target="_blank">Vue 3</a>.
</h3> </h3>
</div> </div>
@ -229,7 +297,7 @@ export default {
<template> <template>
<main> <main>
<h1>{{content}}</h1> <h1>{{content}}</h1>
<cite>当前vue-live版本: v{{$store.version}}</cite> <cite>当前Fite版本: v{{$store.version}}</cite>
</main> </main>
</template> </template>