Skip to content

Commit

Permalink
merge #301
Browse files Browse the repository at this point in the history
  • Loading branch information
karanrainafynd committed Jul 23, 2024
2 parents 1af8d64 + cc73085 commit 37591aa
Show file tree
Hide file tree
Showing 3 changed files with 52 additions and 50 deletions.
65 changes: 32 additions & 33 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@

# Fynd Development Kit
>**Note:** Experimental support for Windows is available, it may not be fully stable.
<div>
[![NPM Version][npm-image]][npm-url]
[![NPM Downloads][downloads-image]][downloads-url]
Expand All @@ -12,12 +11,12 @@

Fynd development Kit (FDK CLI) is a cli tool developed by Fynd to create and update themes, extensions and various other components of the [Fynd Platform](https://platform.fynd.com/).
### Quick Links
| [Fynd Platform](https://platform.fynd.com/) | [Fynd Partners](https://partners.fynd.com/) | [Partners Documentation](https://partners.fynd.com/help) | [Platform Documentation](https://platform.fynd.com/help) | [Other Projects](#other-fynd-projects) | [Contributing](CONTRIBUTING.md) |
| [Fynd Platform](https://platform.fynd.com/) | [Fynd Partners](https://partners.fynd.com/) | [Partners Documentation](https://partners.fynd.com/help) | [Platform Documentation](https://platform.fynd.com/help) | [Other Projects](#other-fynd-projects) | [Contributing](CONTRIBUTING.md) |

# Prerequisites

- You must have created a [partner account](https://partners.fynd.com/)
- You must have created development account [guide](https://partners.fynd.com/help/docs/partners/testing-extension/development-acc)
- You must have created development account [guide](https://partners.fynd.com/help/docs/partners/testing-extension/development-acc)
- You must have installed [Git](https://github.com/git-guides/install-git), if you don't already have it.
- You must have installed [Nodejs](https://nodejs.org/en/download/package-manager), if you don't already have it.
- Optional Prerequisites
Expand All @@ -44,16 +43,16 @@ To see the available extension commands, enter:
```sh
fdk extension
```
See the the [Command reference](#commands-reference) for syntax details and usage examples of the commands.
See the the [Command reference](#commands-reference) for syntax details and usage examples of the commands.



## Commands
___

### Global Commands
| Command | Description |
| ------------- |-------------|
| Command | Description |
| ------------- |-------------|
| [login](#login) | Login user |
| [user](#user) | Shows user details of logged in user |
| [logout](#logout) | Logout user |
Expand All @@ -62,8 +61,8 @@ ___


### Theme Commands
| Command | Description |
| ------------- |-------------|
| Command | Description |
| ------------- |-------------|
| [new](#theme-new) | Create new theme |
| [init](#theme-init) | Clone or download the code of the live website onto your local machine to set up a local development environment for testing and modifications. |
| [serve](#theme-serve) | Initiate theme development on your local machine. Your changes will automatically reflect in the browser whenever you save |
Expand All @@ -77,16 +76,16 @@ ___
| [active-context](theme-active-context) | show currently active context |

### Extension Commands
| Command | Description |
| ------------- |-------------|
| Command | Description |
| ------------- |-------------|
| [init](#extension-init) | Utilize this command to set up a new extension locally, leveraging existing templates of your choice. |
| [setup](#extension-setup) | Configure your extension locally using the existing API Key and API Secret provided for the extension inside the partners panel.
| [preview-url](#extension-preview-url) | Create a tunnel and provide a link to tryout extension on development company
| [launch-url](#extension-launch-url) | Get/set extension's lanuch url |

### Partner Commands
| Command | Description |
| ------------- |-------------|
| Command | Description |
| ------------- |-------------|
| [connect](#partner-connect) | Add partner access token so that you don't need to add it explicitly |

### Config Commands
Expand All @@ -95,11 +94,11 @@ ___
|--------------|--------------------------------------|
| [set](#config-set-commands) | Set configuration values. |
| [get](#config-get-commands) | Retrieve current configuration values.|
| [delete](#config-delete-commands) (alias: `rm`) | Delete configuration values.
| [delete](#config-delete-commands) (alias: `rm`) | Delete configuration values.

### Environment Commands
| Command | Description |
| ------------- |-------------|
| Command | Description |
| ------------- |-------------|
| [env get](#env-get) | Shows current environment |
| [env set](#env-set) | Set active environment to the value provided by the user. Default environment: `fynd`| |

Expand Down Expand Up @@ -162,8 +161,8 @@ This command allows user to login via partner panel.
fdk login
```
#### **Command Options**
| Option | Description |
| ------------- |-------------|
| Option | Description |
| ------------- |-------------|
| --help | Show help |
| --verbose, -v | enable debug mode |

Expand Down Expand Up @@ -223,7 +222,7 @@ fdk theme new [options]

#### **Example**
```sh
fdk theme new -n [your-theme-name]
fdk theme new -n [your-theme-name]
```

___
Expand All @@ -238,8 +237,8 @@ This command is used to initialize an exisiting theme on your local system.
fdk theme init [options]
```
#### **Command Options**
| Option | Description |
| ------------- |-------------|
| Option | Description |
| ------------- |-------------|
| --help | Show help |
| --verbose, -v | enable debug mode |

Expand All @@ -259,15 +258,15 @@ This command is used to add a new context.
fdk theme context [options]
```
#### **Command Options**
| Option | Description | Required |
| Option | Description | Required |
| ------------- |-------------| -------- |
| --name, -n | Context name | Yes |
| --help | Show help | No |
| --verbose, -v | enable debug mode | No |

#### **Example**
```sh
fdk theme context -n [context-name]
fdk theme context -n [context-name]
```
___

Expand Down Expand Up @@ -300,8 +299,8 @@ This command is used to run a theme on your local system.
fdk theme serve [options]
```
#### **Command Options**
| Option | Description |
| ------------- |-------------|
| Option | Description |
| ------------- |-------------|
| --ssr | Enable/disable Server-side rendering |
| --port | Pass custom port number to serve theme. `Default: 5001` |
| --help | Show help |
Expand Down Expand Up @@ -362,7 +361,7 @@ ___
This command is used to preview the theme on browser.
#### **Syntax**
```sh
fdk theme open
fdk theme open
```
### Extension Commands
Extensions are pluggable snippets of code that can be installed in your applications so improve the feature set of your application. To know more visit - [Fynd Partners](https://partners.fynd.com/)
Expand All @@ -382,8 +381,8 @@ This command is used to create a extension's initial code with required dependen
fdk extension init [options]
```
#### **Command Options**
| Option | Description |
| ------------- |-------------|
| Option | Description |
| ------------- |-------------|
| --target-dir | Target Directory |
| --help | Show help |
| --verbose | enable debug mode |
Expand All @@ -403,8 +402,8 @@ fdk extension setup [options]
```

#### **Command Options**
| Option | Description |
| ------------- |-------------|
| Option | Description |
| ------------- |-------------|
| --target-dir | Target Directory |
| --help | Show help |
| --verbose | enable debug mode |
Expand Down Expand Up @@ -468,8 +467,8 @@ This command is used to get or set the launch url of your extension
fdk extension launch-url get/set [options]
```
#### **Command Options**
| Option | Description |
| ------------- |-------------|
| Option | Description |
| ------------- |-------------|
| --url | URL to be set |
| --api-key | Extension ID |
| --help | Show help |
Expand All @@ -496,8 +495,8 @@ This command is used to add your partner access token to update extension detail
fdk partner connect [options]
```
#### **Command Options**
| Option | Description |
| ------------- |-------------|
| Option | Description |
| ------------- |-------------|
| --help | Show help |
| --verbose, -v | enable debug mode |

Expand Down
27 changes: 14 additions & 13 deletions src/helper/serve.utils.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ import https from 'https';
const packageJSON = require('../../package.json');

const BUILD_FOLDER = './.fdk/dist';
const SERVE_BUILD_FOLDER = './.fdk/distServed';
let port = 5001;
let sockets = [];
let publicCache = {};
Expand Down Expand Up @@ -173,7 +174,7 @@ export async function startServer({ domain, host, isSSR, port }) {

applyProxy(app);

app.use(express.static(path.resolve(process.cwd(), BUILD_FOLDER)));
app.use(express.static(path.resolve(process.cwd(), SERVE_BUILD_FOLDER)));
app.get(['/__webpack_hmr', '/manifest.json'], async (req, res, next) => {
return res.end();
});
Expand All @@ -195,11 +196,11 @@ export async function startServer({ domain, host, isSSR, port }) {

const BUNDLE_PATH = path.join(
process.cwd(),
path.join('.fdk', 'dist', 'themeBundle.common.js'),
path.join('.fdk', 'distServed', 'themeBundle.common.js'),
);
if (!fs.existsSync(BUNDLE_PATH))
return res.sendFile(
path.join(__dirname, '../../', '/dist/helper', '/loader.html'),
path.join(__dirname, '../../', '/distServed/helper', '/loader.html'),
);
if (req.originalUrl == '/favicon.ico' || req.originalUrl == '/.webp') {
return res.status(404).send('Not found');
Expand All @@ -211,7 +212,7 @@ export async function startServer({ domain, host, isSSR, port }) {
if (isSSR) {
const BUNDLE_PATH = path.join(
process.cwd(),
'/.fdk/dist/themeBundle.common.js',
'/.fdk/distServed/themeBundle.common.js',
);
const User = Configstore.get(CONFIG_KEYS.AUTH_TOKEN);
themeUrl = (
Expand Down Expand Up @@ -264,24 +265,24 @@ export async function startServer({ domain, host, isSSR, port }) {
)}"></script>`,
);
const umdJsAssests = glob
.sync(`${Theme.BUILD_FOLDER}/themeBundle.umd.**.js`)
.sync(`${Theme.SERVE_BUILD_FOLDER}/themeBundle.umd.**.js`)
.filter((x) => !x.includes('.min.'));
umdJsAssests.forEach((umdJsLink) => {
umdJsInitial.after(
`<script type="text/javascript" src="${urlJoin(
getFullLocalUrl(port),
umdJsLink.replace('./.fdk/dist/', ''),
umdJsLink.replace('./.fdk/distServed/', ''),
)}"></script>`,
);
});

const cssAssests = glob.sync(`${Theme.BUILD_FOLDER}/**.css`);
const cssAssests = glob.sync(`${Theme.SERVE_BUILD_FOLDER}/**.css`);
const cssInitial = $('link[data-css-cli-source="initial"]');
cssAssests.forEach((cssLink) => {
cssInitial.after(
`<link rel="stylesheet" href="${urlJoin(
getFullLocalUrl(port),
cssLink.replace('./.fdk/dist/', ''),
cssLink.replace('./.fdk/distServed/', ''),
)}"></link>`,
);
});
Expand All @@ -298,7 +299,7 @@ export async function startServer({ domain, host, isSSR, port }) {
errorString = `<h3><b>${errorString}</b></h3>`;
const mapContent = JSON.parse(
fs.readFileSync(
`${BUILD_FOLDER}/themeBundle.common.js.map`,
`${SERVE_BUILD_FOLDER}/themeBundle.common.js.map`,
{ encoding: 'utf8', flag: 'r' },
),
);
Expand Down Expand Up @@ -368,7 +369,7 @@ export async function startReactServer({ domain, host, isHMREnabled, port }) {
}

const ctx = {
buildPath: path.resolve(process.cwd(), Theme.BUILD_FOLDER),
buildPath: path.resolve(process.cwd(), Theme.SERVE_BUILD_FOLDER),
NODE_ENV: 'development',
localThemePort: port,
context: process.cwd(),
Expand All @@ -392,7 +393,7 @@ export async function startReactServer({ domain, host, isHMREnabled, port }) {

app.use(webpackHotMiddleware(compiler));
}
app.use(express.static(path.resolve(process.cwd(), BUILD_FOLDER)));
app.use(express.static(path.resolve(process.cwd(), SERVE_BUILD_FOLDER)));

app.use((request, response, next) => {
// Filtering so that HMR file requests are not routed to skyfire pods
Expand Down Expand Up @@ -427,14 +428,14 @@ export async function startReactServer({ domain, host, isHMREnabled, port }) {
currentContext.theme_id,
);
}
const BUNDLE_DIR = path.join(process.cwd(), path.join('.fdk', 'dist'));
const BUNDLE_DIR = path.join(process.cwd(), path.join('.fdk', 'distServed'));
if (req.originalUrl == '/favicon.ico' || req.originalUrl == '/.webp') {
return res.status(404).send('Not found');
}
// While build is not complete
if (!fs.existsSync(path.join(BUNDLE_DIR, 'themeBundle.umd.js'))) {
return res.sendFile(
path.join(__dirname, '../../', '/dist/helper', '/loader.html'),
path.join(__dirname, '../../', '/distServed/helper', '/loader.html'),
);
}
const skyfireUrl = new URL(urlJoin(domain, req.originalUrl));
Expand Down
10 changes: 6 additions & 4 deletions src/lib/Theme.ts
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,7 @@ export default class Theme {
'react-template',
);
static BUILD_FOLDER = './.fdk/dist';
static SERVE_BUILD_FOLDER = './.fdk/distServed';
static SRC_FOLDER = path.join('.fdk', 'temp-theme');
static VUE_CLI_CONFIG_PATH = path.join('.fdk', 'vue.config.js');
static REACT_CLI_CONFIG_PATH = 'webpack.config.js';
Expand Down Expand Up @@ -1158,7 +1159,7 @@ export default class Theme {
Logger.info(`Locally building`);
Theme.createVueConfig();
await devBuild({
buildFolder: Theme.BUILD_FOLDER,
buildFolder: Theme.SERVE_BUILD_FOLDER,
imageCdnUrl: urlJoin(getFullLocalUrl(port), 'assets/images'),
isProd: isSSR,
});
Expand All @@ -1179,7 +1180,7 @@ export default class Theme {
watcher.on('change', async () => {
Logger.info(chalk.bold.green(`building`));
await devBuild({
buildFolder: Theme.BUILD_FOLDER,
buildFolder: Theme.SERVE_BUILD_FOLDER,
imageCdnUrl: urlJoin(
getFullLocalUrl(port),
'assets/images',
Expand Down Expand Up @@ -1209,7 +1210,7 @@ export default class Theme {
await Theme.createReactSectionsIndexFile();

await devReactBuild({
buildFolder: Theme.BUILD_FOLDER,
buildFolder: Theme.SERVE_BUILD_FOLDER,
runOnLocal: true,
localThemePort: port,
isHMREnabled,
Expand All @@ -1228,7 +1229,7 @@ export default class Theme {
Logger.info(chalk.bold.green(`Watching files for changes`));
devReactWatch(
{
buildFolder: Theme.BUILD_FOLDER,
buildFolder: Theme.SERVE_BUILD_FOLDER,
runOnLocal: true,
localThemePort: port,
isHMREnabled,
Expand Down Expand Up @@ -1604,6 +1605,7 @@ export default class Theme {
};
private static clearPreviousBuild = () => {
rimraf.sync(Theme.BUILD_FOLDER);
rimraf.sync(Theme.SERVE_BUILD_FOLDER);
rimraf.sync(Theme.SRC_ARCHIVE_FOLDER);
};

Expand Down

0 comments on commit 37591aa

Please sign in to comment.