ephect-io/create-app

有效!

安装: 93

依赖: 0

建议者: 0

安全性: 0

星标: 0

关注者: 0

分支: 0

开放问题: 0

语言:JavaScript

类型:应用程序

0.7.1 2024-05-04 21:37 UTC

README

Ephect

Create-App

这是一个快速入门指南,帮助您创建一个可工作的Ephect项目。

此仓库不打算被克隆。相反,请按照以下说明操作。

要求

由于Ephect是一个混合环境,您需要安装PHP和NodeJS。

强烈推荐使用最新版本。

Ephect与PHP 8.3和NodeJS LTS 20.12.0兼容。

创建一个基本的Ephect应用程序项目

打开终端并输入

composer create-project ephect-io/create-app my-project

移动到 my-project 目录。

您将看到一个 app 目录,其中包含一个Ephect应用程序的标准结构

    app
    ├── Assets
    │   ├── css
    │   │   ├── app.css
    │   │   ├── index.css
    │   ├── img
    │   │   └── salamandra.png
    │   ├── .htaccess
    │   ├── bootstrap.php
    │   ├── favicon.ico
    │   ├── index.php
    │   └── web.config
    ├── Commands
    │   └── Hello.php
    ├── Components
    │   ├── Additionals
    │   │   ├── Footer.phtml
    │   │   ├── Header.phtml
    │   │   ├── HeaderAndFooter.phtml
    │   │   └── Mother.phtml
    │   └── Home
    │       ├── Com.phtml
    │       └── Dummy.phtml
    ├── JavaScripts
    │   └── index.js
    ├── Pages
    │   └── Home.phtml
    ├── App.phtml
    └── Switcher.phtml

public 目录不为空,但其文件稍后会被资产文件覆盖

    public
    ├── bootstrap.php
    ├── favicon.ico
    └── index.php

构建应用程序

首先,安装所有需要的模块。

npm install

如果您不设置Web服务器,则需要在一个单独的终端中运行应用程序。

打开另一个终端,移动到您的项目目录并输入

php egg serve

回到第一个终端并输入

npm run dev

您应该看到以下内容

> create-app@0.7.0 dev
> run-script-os

> create-app@0.7.0 dev:darwin:linux
> bash scripts/dev.sh all

Running webpack...
asset app.min.js 2.32 KiB [emitted] (name: main)
runtime modules 274 bytes 1 module
./app/JavaScripts/index.js 212 bytes [built] [code generated]
webpack 5.91.0 compiled successfully in 257 ms

Publishing assets...
app/Assets/css -> public/css
app/Assets/css/app.css -> public/css/app.css
app/Assets/css/index.css -> public/css/index.css
app/Assets/css/setup.css -> public/css/setup.css
app/Assets/img -> public/img
app/Assets/img/css -> public/img/css
app/Assets/img/css/app.css -> public/img/css/app.css
app/Assets/img/css/index.css -> public/img/css/index.css
app/Assets/img/css/setup.css -> public/img/css/setup.css
app/Assets/img/salamandra.png -> public/img/salamandra.png

Sharing modules...
node_modules/human-writes/dist/web/human-writes.min.js -> public/modules/human-writes.min.js

Building the app...
Compiling App ... 021ms
Compiling Home, querying https://:8000/ ... 017ms

这是一个简单的页面,包含2个子组件;第一个通过useState钩子将值传递给第二个。

您将在 cache 目录中找到生成的应用程序。

注意

虽然这个示例在PHP内嵌服务器上运行良好,但建议为您的项目设置一个专用的Web服务器。

更多详细信息请参见文档仓库 https://github.com/ephect-io/documentation