@fstacksoftware/shopify-dev 1.0.0

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+#! /usr/bin/env node
+export {};

package/dist/index.js

@@ -0,0 +1,33 @@
+#! /usr/bin/env node
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var commander_1 = require("commander");
+var env_1 = __importDefault(require("./utils/env"));
+var cf_tunnel_1 = __importDefault(require("./utils/cf-tunnel"));
+var shopify_app_1 = __importDefault(require("./utils/shopify-app"));
+var constants_1 = require("./utils/constants");
+var env = new env_1.default(constants_1.CLOUDFLARED_FOLDER_PATH, constants_1.ENV_PATH);
+var tunnel = new cf_tunnel_1.default(env);
+var start = function (runMode, isQuickMode, isReset) {
+    if (isReset === void 0) { isReset = false; }
+    return new shopify_app_1.default(env, tunnel, isQuickMode, isReset).start(runMode);
+};
+commander_1.program
+    .command('dev')
+    .description('Run a shopify app in dev mode')
+    .option('-q,--quick', 'Use Cloudflare quick tunnel')
+    .option('-r,--reset', 'Reset your default shopify dev config')
+    .action(function (options) {
+    start(constants_1.ERunMode['DEV'], options.quick, options.reset);
+});
+commander_1.program
+    .command('start')
+    .description('Run a shopify app in production mode')
+    .option('-q,--quick', 'Use Cloudflare quick tunnel')
+    .action(function (options) {
+    start(constants_1.ERunMode['PROD'], options.quick);
+});
+commander_1.program.parse(process.argv);

package/dist/utils/cf-tunnel.d.ts

@@ -0,0 +1,7 @@
+import EnvironmentVariable from './env';
+export default class CloudflaredTunnel {
+    private env;
+    constructor(env: EnvironmentVariable);
+    quick(): Promise<string>;
+    tunnel(): Promise<string>;
+}

package/dist/utils/cf-tunnel.js

@@ -0,0 +1,94 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function () { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function () { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var tunnel_1 = require("@fstacksoftware/tunnel");
+var path_1 = __importDefault(require("path"));
+var constants_1 = require("./constants");
+var CloudflaredTunnel = /** @class */ (function () {
+    function CloudflaredTunnel(env) {
+        this.env = env;
+    }
+    CloudflaredTunnel.prototype.quick = function () {
+        return __awaiter(this, void 0, void 0, function () {
+            var url;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0: return [4 /*yield*/, (0, tunnel_1.useCloudflareTunnel)(parseInt(this.env.get('VITE_PORT')))];
+                    case 1:
+                        url = _a.sent();
+                        return [2 /*return*/, url];
+                }
+            });
+        });
+    };
+    CloudflaredTunnel.prototype.tunnel = function () {
+        return __awaiter(this, void 0, void 0, function () {
+            var tunnel;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        if (this.env.get('CF_HOST_PATTERN') && !new RegExp(this.env.get('CF_HOST_PATTERN')).test(this.env.get('VITE_HOST'))) {
+                            throw new Error("VITE_HOST(".concat(this.env.get('VITE_HOST'), ") does not satisfy the regex condition: ").concat(this.env.get('CF_HOST_PATTERN')));
+                        }
+                        tunnel = new tunnel_1.CloudflareTunnel({
+                            certPath: path_1.default.join(constants_1.CLOUDFLARED_FOLDER_PATH, './cert.pem'),
+                            cfSecretKey: this.env.get('CF_SECRET_KEY'),
+                            cfAccountTag: this.env.get('CF_ACCOUNT_TAG'),
+                            tunnelName: this.env.get('VITE_HOST').split('.')[0],
+                            tunnels: [
+                                {
+                                    hostname: this.env.get('VITE_HOST'),
+                                    service: "http://localhost:".concat(this.env.get('VITE_PORT')),
+                                },
+                            ],
+                            debug: false,
+                        });
+                        return [4 /*yield*/, tunnel.start.bind(tunnel)()];
+                    case 1:
+                        _a.sent();
+                        return [2 /*return*/, this.env.get('VITE_HOST')];
+                }
+            });
+        });
+    };
+    return CloudflaredTunnel;
+}());
+exports.default = CloudflaredTunnel;

package/dist/utils/constants.d.ts

@@ -0,0 +1,7 @@
+export declare const CLOUDFLARED_FOLDER_PATH: string;
+export declare const WEB_FOLDER_PATH: string;
+export declare const ENV_PATH: string;
+export declare enum ERunMode {
+    DEV = 0,
+    PROD = 1
+}

package/dist/utils/constants.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ERunMode = exports.ENV_PATH = exports.WEB_FOLDER_PATH = exports.CLOUDFLARED_FOLDER_PATH = void 0;
+var fs_1 = require("fs");
+var path_1 = __importDefault(require("path"));
+exports.CLOUDFLARED_FOLDER_PATH = path_1.default.resolve('./.cloudflared');
+exports.WEB_FOLDER_PATH = path_1.default.resolve('./web');
+exports.ENV_PATH = (0, fs_1.existsSync)(path_1.default.resolve('./web/.env')) ? path_1.default.resolve('./web/.env') : path_1.default.resolve('./.env');
+var ERunMode;
+(function (ERunMode) {
+    ERunMode[ERunMode["DEV"] = 0] = "DEV";
+    ERunMode[ERunMode["PROD"] = 1] = "PROD";
+})(ERunMode || (exports.ERunMode = ERunMode = {}));

package/dist/utils/env.d.ts

@@ -0,0 +1,11 @@
+export default class EnvironmentVariable {
+    private cloudflaredFolderPath;
+    private envPath;
+    data: {
+        [key: string]: string;
+    };
+    constructor(cloudflaredFolderPath: string, envPath: string);
+    private getCurrentEnv;
+    get(key: string): string;
+    set(key: string, value: string): void;
+}

package/dist/utils/env.js

@@ -0,0 +1,52 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var fs_1 = require("fs");
+var path_1 = __importDefault(require("path"));
+var EnvironmentVariable = /** @class */ (function () {
+    function EnvironmentVariable(cloudflaredFolderPath, envPath) {
+        this.cloudflaredFolderPath = cloudflaredFolderPath;
+        this.envPath = envPath;
+        this.data = __assign(__assign({}, this.getCurrentEnv()), JSON.parse((0, fs_1.readFileSync)(path_1.default.join(this.cloudflaredFolderPath, './account.json'), { encoding: 'utf-8' })));
+    }
+    EnvironmentVariable.prototype.getCurrentEnv = function () {
+        var content = (0, fs_1.readFileSync)(this.envPath, { encoding: 'utf-8' }).split('\n');
+        return content.reduce(function (previousValue, currentValue) {
+            var _a;
+            if (!currentValue)
+                return previousValue;
+            var splittedData = currentValue.trim().split('=');
+            var key = splittedData[0];
+            var value = splittedData[1].trim().replace(/['"]/g, '');
+            return __assign(__assign({}, previousValue), (_a = {}, _a[key] = value, _a));
+        }, {});
+    };
+    EnvironmentVariable.prototype.get = function (key) {
+        return this.data[key];
+    };
+    EnvironmentVariable.prototype.set = function (key, value) {
+        this.data[key] = value;
+        var currentEnv = this.getCurrentEnv();
+        currentEnv[key] = value;
+        var newEnvData = Object.keys(currentEnv).reduce(function (previousValue, key) {
+            previousValue += "".concat(key, "=").concat(currentEnv[key], "\n");
+            return previousValue;
+        }, '');
+        (0, fs_1.writeFileSync)(this.envPath, newEnvData);
+    };
+    return EnvironmentVariable;
+}());
+exports.default = EnvironmentVariable;

package/dist/utils/shopify-app.d.ts

@@ -0,0 +1,14 @@
+import EnvironmentVariable from './env';
+import CloudflaredTunnel from './cf-tunnel';
+import { ERunMode } from './constants';
+export default class ShopifyApp {
+    private env;
+    private isQuickTunnel;
+    private tunnel;
+    private isReset;
+    constructor(env: EnvironmentVariable, tunnel: CloudflaredTunnel, isQuickTunnel: boolean, isReset: boolean);
+    private updateAppURL;
+    private startProd;
+    private startDev;
+    start(mode: ERunMode): void;
+}

package/dist/utils/shopify-app.js

@@ -0,0 +1,79 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var child_process_1 = require("child_process");
+var constants_1 = require("./constants");
+var ShopifyApp = /** @class */ (function () {
+    function ShopifyApp(env, tunnel, isQuickTunnel, isReset) {
+        this.env = env;
+        this.tunnel = tunnel;
+        this.isQuickTunnel = isQuickTunnel;
+        this.isReset = isReset;
+    }
+    ShopifyApp.prototype.updateAppURL = function (url) {
+        (0, child_process_1.spawn)("npx shopify app update-url --api-key=".concat(this.env.get('VITE_SHOPIFY_API_KEY'), " --app-url=").concat(url, " --redirect-urls=").concat(url, "/auth/callback,").concat(url, "/api/auth/callback,").concat(url, "/auth/shopify/callback"), { shell: true, stdio: 'inherit' });
+    };
+    ShopifyApp.prototype.startProd = function (host) {
+        if (this.isQuickTunnel)
+            this.env.set('VITE_HOST', host);
+        this.updateAppURL("https://".concat(host));
+        (0, child_process_1.spawn)('npm', ['run', 'serve'], {
+            shell: true,
+            stdio: 'inherit',
+            cwd: constants_1.WEB_FOLDER_PATH,
+            env: __assign(__assign({}, process.env), { DEBUG: 'true' }),
+        });
+    };
+    ShopifyApp.prototype.startDev = function (host) {
+        (0, child_process_1.spawn)('npx', __spreadArray([
+            'shopify',
+            'app',
+            'dev',
+            '--tunnel-url',
+            "https://".concat(host, ":").concat(this.env.get('VITE_PORT'))
+        ], (this.isReset ? ['--reset'] : []), true), {
+            shell: true,
+            stdio: 'inherit',
+        });
+    };
+    ShopifyApp.prototype.start = function (mode) {
+        var _this = this;
+        var tunnel = this.isQuickTunnel ? function () { return _this.tunnel.quick(); } : function () { return _this.tunnel.tunnel(); };
+        tunnel()
+            .then(function (url) {
+            var host = url.replace(/https?:\/\//g, '');
+            switch (mode) {
+                case constants_1.ERunMode['DEV']:
+                    return _this.startDev(host);
+                case constants_1.ERunMode['PROD']:
+                    return _this.startProd(host);
+                default:
+                    return;
+            }
+        })
+            .catch(function (err) {
+            throw err;
+        });
+    };
+    return ShopifyApp;
+}());
+exports.default = ShopifyApp;

package/package.json

@@ -0,0 +1,31 @@
+{
+    "name": "@fstacksoftware/shopify-dev",
+    "version": "1.0.0",
+    "main": "dist/index.js",
+    "license": "MIT",
+    "bin": {
+        "shopify-dev": "dist/index.js"
+    },
+    "scripts": {
+        "dev": "ts-node src/index.ts",
+        "build": "rimraf ./dist && tsc",
+        "lint": "eslint src/**/*",
+        "lint:fix": "eslint src/**/* --fix"
+    },
+    "files": [
+        "dist"
+    ],
+    "devDependencies": {
+        "@types/node": "^20.5.7",
+        "@typescript-eslint/eslint-plugin": "^6.5.0",
+        "@typescript-eslint/parser": "^6.5.0",
+        "eslint": "^8.48.0",
+        "rimraf": "^5.0.1",
+        "ts-node": "^10.9.1",
+        "typescript": "^5.2.2"
+    },
+    "dependencies": {
+        "@fstacksoftware/tunnel": "^1.3.6",
+        "commander": "^11.0.0"
+    }
+}