create-blocklet 0.3.8 → 0.3.9

package/README.md

@@ -36,6 +36,8 @@ Currently supported template presets include:
 - `react`
 - `vue3 + vite`
 - `vue2 + @vue/cli`
+- `solid-js`
+- `svelte`
 - `next.js`
 - `react + gunjs`
 
@@ -44,7 +46,10 @@ Currently supported template presets include:
 - `react`
 - `vue3 + vite`
 - `vue2 + @vue/cli`
+- `solid-js`
+- `svelte`
 - `blocklet page`
+- `html`
 
 **api**
 - `express`

package/common/.makefiles/bump_version.sh

@@ -39,7 +39,8 @@ if [ -f $VERSION ]; then
     echo -e "${NOTICE_FLAG} Will set new version to be ${WHITE}$INPUT_STRING"
     echo $INPUT_STRING >$VERSION
 
-    echo "## $INPUT_STRING ($NOW)\n" >tmpfile
+    echo "## $INPUT_STRING ($NOW)" >tmpfile
+    echo "" >>tmpfile
     git log --pretty=format:"- %s" "$BASE_STRING"...HEAD >>tmpfile
     echo "" >>tmpfile
     echo "" >>tmpfile

package/common/_gitignore

@@ -1,35 +1,28 @@
 # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 
 # dependencies
-/.pnp
+.pnp
 .pnp.js
 .DS_Store
 node_modules
 
 # testing
-/coverage
+coverage
 
 # production
-/build
-/dist
+build
+dist
+dist-ssr
 .blocklet
 
 # local env files
-.env.local
-.env.*.local
+*.local
 
 # Log files
+logs
+*.log
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 pnpm-debug.log*
-
-# Editor directories and files
-.idea
-.vscode
-*.suo
-*.ntvs*
-*.njsproj
-*.sln
-*.sw?
-
+lerna-debug.log*

package/index.js

@@ -8,6 +8,7 @@ import { cd, argv, fs, YAML, chalk, path } from 'zx';
 import ora from 'ora';
 import prompts from 'prompts';
 import * as envfile from 'envfile';
+import getPort from 'get-port';
 
 import { echoBrand, echoDocument } from './lib/arcblock.js';
 import { getUser } from './lib/index.js';
@@ -15,7 +16,7 @@ import { checkServerInstalled, checkServerRunning, checkSatisfiedVersion, getSer
 import { toBlockletDid } from './lib/did.js';
 import { initGitRepo } from './lib/git.js';
 
-const { yellow, red, green, cyan, blue, bold } = chalk;
+const { yellow, red, green, cyan, blue, bold, magenta } = chalk;
 
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
 
@@ -31,6 +32,11 @@ const TYPES = [
         display: 'react',
         color: yellow,
       },
+      {
+        name: 'solidjs',
+        display: 'solidjs',
+        color: yellow,
+      },
       {
         name: 'vue',
         display: 'vue3 + vite',
@@ -41,6 +47,11 @@ const TYPES = [
         display: 'vue2 + @vue/cli',
         color: green,
       },
+      {
+        name: 'svelte',
+        display: 'svelte',
+        color: magenta,
+      },
       {
         name: 'nextjs',
         display: 'next.js',
@@ -62,6 +73,11 @@ const TYPES = [
         display: 'react',
         color: yellow,
       },
+      {
+        name: 'solidjs',
+        display: 'solidjs',
+        color: yellow,
+      },
       {
         name: 'vue',
         display: 'vue3 + vite',
@@ -72,11 +88,21 @@ const TYPES = [
         display: 'vue2 + @vue/cli',
         color: green,
       },
+      {
+        name: 'svelte',
+        display: 'svelte',
+        color: magenta,
+      },
       {
         name: 'blocklet-page',
         display: 'blocklet page',
         color: blue,
       },
+      {
+        name: 'html',
+        display: 'html',
+        color: blue,
+      },
     ],
   },
   {
@@ -281,8 +307,16 @@ async function init() {
   modifyBlockletMd((md) => {
     return md.replace(/# template-react/g, `# ${name}`);
   });
-  if (!['blocklet-page'].includes(framework)) {
-    modifyEnv((env) => {
+
+  let randomPort;
+  if (['dapp'].includes(type)) {
+    randomPort = await getPort();
+  }
+  modifyEnv((env) => {
+    if (randomPort) {
+      env.API_PORT = randomPort;
+    }
+    if (!['blocklet-page'].includes(framework)) {
       if (['react'].includes(framework)) {
         env.REACT_APP_TITLE = name;
       } else if (['vue', 'blocklet-page'].includes(framework)) {
@@ -290,9 +324,9 @@ async function init() {
       } else {
         env.APP_TITLE = name;
       }
-      return env;
-    });
-  }
+    }
+    return env;
+  });
 
   // patch blocklet author
   modifyBlockletYaml(async (yamlConfig) => {
@@ -307,10 +341,14 @@ async function init() {
       yamlConfig.did = did;
     });
     modifyPackage((pkg) => {
-      if (type === 'dapp') {
-        pkg.scripts['bundle:client'] = ejs.render(pkg.scripts['bundle:client'], { did });
-      } else if (type === 'static') {
-        pkg.scripts.bundle = ejs.render(pkg.scripts.bundle, { did });
+      try {
+        if (type === 'dapp') {
+          pkg.scripts['bundle:client'] = ejs.render(pkg.scripts['bundle:client'], { did });
+        } else if (type === 'static') {
+          pkg.scripts.bundle = ejs.render(pkg.scripts.bundle, { did });
+        }
+      } catch {
+        console.info('\nNo need to patch bundle script\n');
       }
     });
     // disabled random logo
@@ -385,11 +423,9 @@ async function init() {
         execSync('blocklet dev', { stdio: 'inherit' });
       } else {
         console.log();
-        console.log();
       }
     } else {
       console.log();
-      console.log();
     }
 
     if (!isServerInstalled) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-blocklet",
-  "version": "0.3.8",
+  "version": "0.3.9",
   "exports": "./index.js",
   "type": "module",
   "repository": "git@github.com:blocklet/create-blocklet.git",
@@ -36,6 +36,7 @@
     "ejs": "^3.1.6",
     "envfile": "^6.17.0",
     "figlet": "^1.5.2",
+    "get-port": "^6.1.2",
     "gradient-string": "^2.0.0",
     "jdenticon": "^3.1.1",
     "ora": "^6.1.0",

package/templates/blocklet-page-static/package.json

@@ -11,6 +11,6 @@
     "upload": "npm run bundle && blocklet upload .blocklet/release/blocklet.json"
   },
   "dependencies": {
-    "@xmark/cli": "^2.0.31"
+    "@xmark/cli": "^2.0.37"
   }
 }

package/templates/express-api/api/index.js

@@ -2,7 +2,7 @@ const express = require('express');
 
 const app = express();
 
-const port = process.env.BLOCKLET_PORT || 3030;
+const port = process.env.BLOCKLET_PORT || process.env.PORT || 3030;
 
 app.get('/', (req, res) => {
   res.send('Hello World, Blocklet!');

package/templates/express-api/package.json

@@ -15,12 +15,12 @@
   "license": "ISC",
   "dependencies": {
     "@arcblock/did-auth-storage-nedb": "^1.6.3",
-    "@blocklet/sdk": "^1.7.0",
-    "@ocap/client": "^1.15.2",
+    "@blocklet/sdk": "^1.7.9",
+    "@ocap/client": "^1.16.4",
     "dotenv-flow": "^3.2.0",
-    "express": "^4.17.3"
+    "express": "^4.18.0"
   },
   "devDependencies": {
-    "nodemon": "^2.0.15"
+    "nodemon": "^2.0.16"
   }
 }

package/templates/html-static/app/images/logo.svg

@@ -0,0 +1,17 @@
+<svg width="204" height="64" viewBox="0 0 204 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M80 44.5707V20H91.8859C95.101 20 97.7075 22.6064 97.7075 25.8216V27.5875C97.7075 29.135 97.1037 30.5414 96.1188 31.5841C97.8642 32.5893 99.0393 34.4737 99.0393 36.6325V38.7491C99.0393 41.9643 96.4328 44.5707 93.2177 44.5707H80ZM82.5874 30.8109H92.1522C93.8138 30.6754 95.1201 29.284 95.1201 27.5875V25.8216C95.1201 24.0354 93.6721 22.5874 91.8859 22.5874H82.5874V30.8109ZM82.5874 41.9833V33.4091L93.2177 33.3983C95.0039 33.3983 96.4519 34.8463 96.4519 36.6325V38.7491C96.4519 40.5353 95.0039 41.9833 93.2177 41.9833H82.5874ZM106.501 20V44.5707H103.794V20H106.501ZM119.917 26.6346H117.11C113.877 26.6346 111.256 29.2555 111.256 32.4885V38.7167C111.256 41.9498 113.877 44.5707 117.11 44.5707H119.917C123.15 44.5707 125.771 41.9498 125.771 38.7167V32.4885C125.771 29.2555 123.15 26.6346 119.917 26.6346ZM117.11 29.3416C115.372 29.3416 113.963 30.7505 113.963 32.4885V38.7167C113.963 40.4547 115.372 41.8636 117.11 41.8636H119.917C121.655 41.8636 123.064 40.4547 123.064 38.7167V32.4885C123.064 30.7505 121.655 29.3416 119.917 29.3416H117.11ZM149.437 44.5801V35.7411H152.738L157.841 44.5801H160.967L155.097 34.413L159.695 26.4493H156.569L152.767 33.0341H149.437V20H146.73V44.5801H149.437ZM140.902 32.9673V32.4885C140.902 30.7505 139.493 29.3416 137.755 29.3416H134.948C133.21 29.3416 131.801 30.7505 131.801 32.4885V38.7167C131.801 40.4547 133.21 41.8636 134.948 41.8636H137.755C139.493 41.8636 140.902 40.4547 140.902 38.7167V38.2379H143.609V38.7167C143.609 41.9498 140.988 44.5707 137.755 44.5707H134.948C131.715 44.5707 129.094 41.9498 129.094 38.7167V32.4885C129.094 29.2555 131.715 26.6346 134.948 26.6346H137.755C140.988 26.6346 143.609 29.2555 143.609 32.4885V32.9673H140.902ZM168.429 44.5707V20H165.722V44.5707H168.429ZM176.094 36.342V38.7167C176.094 40.4547 177.502 41.8636 179.24 41.8636H182.047C183.785 41.8636 185.194 40.4547 185.194 38.7167V38.2379H187.901V38.7167C187.901 41.9498 185.281 44.5707 182.047 44.5707H179.24C176.007 44.5707 173.386 41.9498 173.386 38.7167V32.4885C173.386 29.2555 176.007 26.6346 179.24 26.6346H182.047C185.281 26.6346 187.901 29.2555 187.901 32.4885V33.635V35.3244V36.342H176.094ZM185.194 33.635H176.094V32.4885C176.094 30.7505 177.502 29.3416 179.24 29.3416H182.047C183.785 29.3416 185.194 30.7505 185.194 32.4885V33.635ZM193.626 30.6973H191.217V27.9903H193.626V23.6154H196.214V27.9903H202.477V30.6973H196.214V39.4188C196.214 40.8351 197.362 41.9833 198.778 41.9833C200.194 41.9833 201.343 40.8351 201.343 39.4188V38.8802H203.93V39.4188C203.93 42.2641 201.623 44.5707 198.778 44.5707C195.933 44.5707 193.626 42.2641 193.626 39.4188V30.6973Z" fill="black"/>
+<path opacity="0.6" fill-rule="evenodd" clip-rule="evenodd" d="M49.12 10.6348L30.7 0L12.28 10.6348V24.7781L0 31.868V53.1375L18.42 63.7723L30.6702 56.6997L30.7 56.7169L30.7298 56.6997L42.98 63.7723L61.4 53.1375V31.868L49.12 24.7781V10.6348ZM59.4813 32.9757L47.2013 25.8859V11.7426L30.7 2.21558L14.1988 11.7426V25.8859L1.91875 32.9757V52.0297L18.42 61.5568L30.6702 54.4841L30.7 54.5013L30.7298 54.4841L42.98 61.5568L59.4813 52.0297V32.9757Z" fill="url(#paint0_linear_898_1378)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M30.6998 14.1797L49.1198 24.8145V46.0841L30.6998 56.7189L12.2798 46.0841V24.8145L30.6998 14.1797ZM15.1579 25.3684L29.7404 33.7876V16.9492L15.1579 25.3684ZM28.781 35.4493L14.1985 27.0301V43.8685L28.781 35.4493ZM31.6592 37.111L46.2417 45.5302L31.6592 53.9494V37.111ZM47.201 43.8685L32.6185 35.4493L47.201 27.0301V43.8685ZM29.7404 53.9494L15.1579 45.5302L29.7404 37.111V53.9494ZM31.6592 16.9492L46.2417 25.3684L31.6592 33.7876V16.9492Z" fill="url(#paint1_linear_898_1378)"/>
+<defs>
+<linearGradient id="paint0_linear_898_1378" x1="30.7" y1="-31.8862" x2="-33.0265" y2="29.4697" gradientUnits="userSpaceOnUse">
+<stop stop-color="#4EF1BA"/>
+<stop offset="0.501904" stop-color="#16CED1"/>
+<stop offset="1" stop-color="#3773F2"/>
+</linearGradient>
+<linearGradient id="paint1_linear_898_1378" x1="33.1078" y1="-37.1138" x2="-37.2973" y2="18.5071" gradientUnits="userSpaceOnUse">
+<stop stop-color="#4EF1BA"/>
+<stop offset="0.501904" stop-color="#16CED1"/>
+<stop offset="1" stop-color="#3773F2"/>
+</linearGradient>
+</defs>
+</svg>

package/templates/html-static/app/index.html

@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="stylesheet" href="./styles/style.css" />
+    <title>HTML Template</title>
+    <script src="__meta__.js"></script>
+  </head>
+  <body>
+    <div id="app">
+      <section class="body">
+        <div class="logo">
+          <img src="./images/logo.svg" alt="logo" />
+          <p>Get started by edit <code class="code">app/index.html</code> file</p>
+        </div>
+        <div class="card-list">
+          <a class="card" href="https://docs.arcblock.io/abtnode/en/blocklet" target="_blank">
+            <h3>Documentation →</h3>
+            <p>Find in-depth information about blocklet features and API.</p>
+          </a>
+          <a class="card" href="https://docs.arcblock.io/abtnode/en/introduction" target="_blank">
+            <h3>Blocklet Server →</h3>
+            <p>Learn about Blocklet Server</p>
+          </a>
+        </div>
+        <br />
+        <br />
+      </section>
+      <footer class="footer">
+        Powered by
+        <a href="http://www.arcblock.io/" target="_blank">
+          <strong>ArcBlock</strong>
+        </a>
+      </footer>
+    </div>
+  </body>
+</html>

package/templates/html-static/app/styles/style.css

@@ -0,0 +1,67 @@
+html,
+body {
+  padding: 0;
+  margin: 0;
+}
+a {
+  text-decoration: none;
+  color: initial;
+}
+#app {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+}
+
+.body {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+.logo {
+  font-size: 18px;
+}
+
+.footer {
+  height: 80px;
+  line-height: 80px;
+  text-align: center;
+  font-size: 18px;
+}
+.card-list {
+  display: flex;
+  margin-top: 30px;
+  gap: 40px;
+  padding: 20px;
+}
+.card {
+  border: 1px solid #e7e7e7;
+  border-radius: 6px;
+  padding: 0 25px;
+  flex: 1;
+  text-decoration: none;
+  color: initial;
+  font-size: 18px;
+}
+.card:hover {
+  box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
+}
+.card h3 {
+  font-size: 24px;
+}
+.code {
+  background: #fafafa;
+  border-radius: 5px;
+  padding: 0.75rem;
+  font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New,
+    monospace;
+}
+
+@media (max-width: 768px) {
+  .card-list {
+    flex-direction: column;
+    gap: 20px;
+  }
+}

package/templates/html-static/blocklet.md

@@ -0,0 +1,3 @@
+# template-html
+
+A html template for creating a new blocklet project.

package/templates/html-static/blocklet.yml

@@ -0,0 +1,48 @@
+name: template-html
+title: Blocklet Template HTML
+description: A Blocklet Server blocklet
+keywords:
+  - blocklet
+  - html
+  - static
+group: static
+did: ''
+main: app
+author:
+  name: Blocklet
+  email: blocklet@arcblock.io
+repository:
+  type: git
+  url: 'git+https://github.com/blocklet/create-blocklet.git'
+specVersion: 1.1.1
+version: 0.1.0
+logo: logo.png
+files:
+  - logo.png
+  - README.md
+  - blocklet.md
+  - screenshots
+interfaces:
+  - type: web
+    name: publicUrl
+    path: /
+    prefix: '*'
+    port: BLOCKLET_PORT
+    protocol: http
+community: ''
+documentation: ''
+homepage: ''
+license: ''
+payment:
+  price: []
+  share: []
+timeout:
+  start: 60
+requirements:
+  server: '>=1.6.29'
+  os: '*'
+  cpu: '*'
+environments: []
+capabilities: {}
+screenshots: []
+children: []

package/templates/html-static/package.json

@@ -0,0 +1,13 @@
+{
+  "name": "template-html",
+  "version": "0.1.0",
+  "scripts": {
+    "clean": "rm -rf .blocklet",
+    "release": "npm run clean && blocklet bundle --create-release",
+    "deploy": "npm run release && blocklet deploy .blocklet/bundle --skip-hooks",
+    "upload": "npm run release && blocklet upload .blocklet/release/blocklet.json"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC"
+}

package/templates/nextjs-dapp/api/index.js

@@ -1,7 +1,7 @@
 const express = require('express');
 const next = require('next');
 
-const port = parseInt(process.env.BLOCKLET_PORT, 10) || 3000;
+const port = parseInt(process.env.BLOCKLET_PORT || process.env.PORT, 10) || 3000;
 const dev = process.env.NODE_ENV !== 'production';
 const app = next({ dev });
 const handle = app.getRequestHandler();

package/templates/nextjs-dapp/package.json

@@ -25,24 +25,24 @@
     ]
   },
   "dependencies": {
-    "@arcblock/did-auth": "^1.16.0",
+    "@arcblock/did-auth": "^1.16.4",
     "@arcblock/did-auth-storage-nedb": "^1.6.3",
-    "@blocklet/sdk": "^1.7.6",
-    "@ocap/client": "^1.16.0",
-    "@ocap/mcrypto": "^1.16.0",
-    "@ocap/wallet": "^1.16.0",
+    "@blocklet/sdk": "^1.7.9",
+    "@ocap/client": "^1.16.4",
+    "@ocap/mcrypto": "^1.16.4",
+    "@ocap/wallet": "^1.16.4",
     "dotenv-flow": "^3.2.0",
-    "express": "^4.17.3",
-    "next": "12.1.0",
-    "react": "17.0.2",
-    "react-dom": "17.0.2"
+    "express": "^4.18.0",
+    "next": "12.1.5",
+    "react": "18.1.0",
+    "react-dom": "18.1.0"
   },
   "devDependencies": {
-    "eslint": "8.11.0",
-    "eslint-config-next": "12.1.0",
+    "eslint": "8.14.0",
+    "eslint-config-next": "12.1.5",
     "husky": "^7.0.4",
-    "lint-staged": "^12.3.7",
-    "nodemon": "^2.0.15",
+    "lint-staged": "^12.4.1",
+    "nodemon": "^2.0.16",
     "npm-run-all": "^4.1.5"
   }
 }

package/templates/react-dapp/.env

@@ -1,3 +1,2 @@
 GENERATE_SOURCEMAP=false
-APP_PORT=3030
 REACT_APP_TITLE=''

package/templates/react-dapp/api/index.js

@@ -20,13 +20,8 @@ app.use(express.urlencoded({ extended: true, limit: '1 mb' }));
 const router = express.Router();
 router.use('/api', require('./routes'));
 
-const isDevelopment = process.env.NODE_ENV === 'development';
 const isProduction = process.env.NODE_ENV === 'production' || process.env.ABT_NODE_SERVICE_ENV === 'production';
 
-if (isDevelopment) {
-  process.env.BLOCKLET_PORT = 3030;
-}
-
 if (isProduction) {
   app.use(cors());
   app.use(compression());
@@ -47,7 +42,7 @@ if (isProduction) {
   app.use(router);
 }
 
-const port = parseInt(process.env.BLOCKLET_PORT, 10) || 3030;
+const port = parseInt(process.env.API_PORT, 10) || 3030;
 
 app.listen(port, (err) => {
   if (err) throw err;

package/templates/react-dapp/craco.config.js

@@ -1,5 +1,7 @@
-const port = process.env.BLOCKLET_PORT || process.env.PORT || 8080;
-const dappPort = process.env.APP_PORT || 3030;
+require('dotenv-flow').config();
+
+const port = process.env.BLOCKLET_PORT || process.env.PORT || 3000;
+const apiPort = process.env.API_PORT || 3030;
 
 module.exports = {
   devServer: {
@@ -10,7 +12,7 @@ module.exports = {
     },
     proxy: {
       '/api': {
-        target: `http://127.0.0.1:${dappPort}`,
+        target: `http://127.0.0.1:${apiPort}`,
       },
     },
   },

package/templates/react-dapp/package.json

@@ -39,25 +39,25 @@
     ]
   },
   "dependencies": {
-    "@arcblock/did-auth": "^1.16.0",
+    "@arcblock/did-auth": "^1.16.4",
     "@arcblock/did-auth-storage-nedb": "^1.6.3",
-    "@blocklet/sdk": "^1.7.6",
+    "@blocklet/sdk": "^1.7.9",
     "@craco/craco": "^6.4.3",
-    "@ocap/client": "^1.16.0",
-    "@ocap/mcrypto": "^1.16.0",
-    "@ocap/wallet": "^1.16.0",
-    "axios": "^0.26.1",
+    "@ocap/client": "^1.16.4",
+    "@ocap/mcrypto": "^1.16.4",
+    "@ocap/wallet": "^1.16.4",
+    "axios": "^0.27.2",
     "compression": "^1.7.4",
     "cookie-parser": "^1.4.6",
     "cors": "^2.8.5",
     "dotenv-flow": "^3.2.0",
-    "express": "^4.17.3",
+    "express": "^4.18.0",
     "express-async-errors": "^3.1.1",
     "express-history-api-fallback": "^2.2.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "react-router-dom": "^6.2.2",
-    "react-scripts": "5.0.0"
+    "react-router-dom": "^6.3.0",
+    "react-scripts": "5.0.1"
   },
   "devDependencies": {
     "@arcblock/eslint-config": "^0.1.8",
@@ -72,8 +72,8 @@
     "eslint-plugin-react-hooks": "^4.2.0",
     "eslint-plugin-unicorn": "^34.0.1",
     "husky": "^7.0.4",
-    "lint-staged": "^12.3.7",
-    "nodemon": "^2.0.15",
+    "lint-staged": "^12.4.1",
+    "nodemon": "^2.0.16",
     "npm-run-all": "^4.1.5",
     "prettier": "^2.6.0"
   }

package/templates/react-gun-dapp/.env

@@ -1,3 +1,2 @@
 GENERATE_SOURCEMAP=false
-APP_PORT=3030
 REACT_APP_TITLE=''

package/templates/react-gun-dapp/api/index.js

@@ -25,13 +25,8 @@ app.use(Gun.serve);
 const router = express.Router();
 router.use('/api', require('./routes'));
 
-const isDevelopment = process.env.NODE_ENV === 'development';
 const isProduction = process.env.NODE_ENV === 'production' || process.env.ABT_NODE_SERVICE_ENV === 'production';
 
-if (isDevelopment) {
-  process.env.BLOCKLET_PORT = 3030;
-}
-
 if (isProduction) {
   app.use(cors());
   app.use(compression());
@@ -52,7 +47,7 @@ if (isProduction) {
   app.use(router);
 }
 
-const port = parseInt(process.env.BLOCKLET_PORT, 10) || 3030;
+const port = parseInt(process.env.API_PORT, 10) || 3030;
 
 const server = app.listen(port, (err) => {
   if (err) throw err;

package/templates/react-gun-dapp/craco.config.js

@@ -1,5 +1,7 @@
-const port = process.env.BLOCKLET_PORT || process.env.PORT || 8080;
-const dappPort = process.env.APP_PORT || 3030;
+require('dotenv-flow').config();
+
+const port = process.env.BLOCKLET_PORT || process.env.PORT || 3000;
+const apiPort = process.env.API_PORT || 3030;
 
 module.exports = {
   devServer: {
@@ -11,11 +13,11 @@ module.exports = {
     proxy: [
       {
         context: ['/api'],
-        target: `http://127.0.0.1:${dappPort}`,
+        target: `http://127.0.0.1:${apiPort}`,
       },
       {
         context: ['/gun'],
-        target: `ws://127.0.0.1:${dappPort}`,
+        target: `ws://127.0.0.1:${apiPort}`,
         ws: true,
       },
     ],