search

marko-js / marko

A declarative, HTML-based language that makes building web apps fun
https://markojs.com/
MIT License
13.25k stars 643 forks source link

markoExpress is not a function #1753

Closed YuriyTigiev closed 2 years ago

YuriyTigiev commented 2 years ago

Marko Version: x.x.x

^5.17.3

Details

app.js

require("@marko/compiler/register");
var express = require('express');
var markoExpress = require("@marko/express");

var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var ccxt = require('ccxt')

var app = express();
app.use(markoExpress());

Expected Behavior

Run the code

Actual Behavior

Returns an error

Possible Fix

Your Environment

cat /etc/os-release
NAME="AlmaLinux"
VERSION="8.4 (Electric Cheetah)"
ID="almalinux"
ID_LIKE="rhel centos fedora"
VERSION_ID="8.4"
PLATFORM_ID="platform:el8"
PRETTY_NAME="AlmaLinux 8.4 (Electric Cheetah)"
ANSI_COLOR="0;34"
CPE_NAME="cpe:/o:almalinux:almalinux:8.4:GA"
HOME_URL="https://almalinux.org/"
DOCUMENTATION_URL="https://wiki.almalinux.org/"
BUG_REPORT_URL="https://bugs.almalinux.org/"

ALMALINUX_MANTISBT_PROJECT="AlmaLinux-8"
ALMALINUX_MANTISBT_PROJECT_VERSION="8.4"

node -v
v14.17.5
npm -v
8.1.3

Steps to Reproduce

npm start

Stack Trace

[ytigiev@screener screener.market]$ npm start 

> screenermarket@0.0.1 start
> node ./bin/www

Hello world!
/var/www/html/screener.market/screener.market/app.js:13
app.use(markoExpress());
        ^

TypeError: markoExpress is not a function
    at Object.<anonymous> (/var/www/html/screener.market/screener.market/app.js:13:9)
    at Module._compile (internal/modules/cjs/loader.js:1072:14)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10)
    at Module.load (internal/modules/cjs/loader.js:937:32)
    at Function.Module._load (internal/modules/cjs/loader.js:778:12)
    at Module.require (internal/modules/cjs/loader.js:961:19)
    at require (internal/modules/cjs/helpers.js:92:18)
    at Object.<anonymous> (/var/www/html/screener.market/screener.market/bin/www.js:7:12)
    at Module._compile (internal/modules/cjs/loader.js:1072:14)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10)
{
  "name": "test",
  "version": "0.0.1",
  "description": "TEST",
  "main": "./bin/www",
  "dependencies": {
    "@marko/express": "^1.0.0",
    "as-table": "^1.0.55",
    "ccxt": "^1.61.24",
    "cjs": "^0.0.11",
    "express": "^4.17.1",
    "marko": "^5.17.3",
    "morgan": "^1.10.0",
    "serve-favicon": "^2.5.0"
  },
  "scripts": {
    "start": "node ./bin/www",
    "inspect": "node --inspect ./bin/www",
    "devstart": "nodemon ./bin/www"
  }
}
DylanPiercey commented 2 years ago

@YuriyTigiev the issue is that @marko/express is now published as an es module, with commonjs shim. Essentially if you are using commonjs (require) you need to read .default, like so:

const markoMiddleware = require("@marko/express").default
YuriyTigiev commented 2 years ago

It helped but now I'm getting another error. Is it also related to a module?

/routes/index.js 

var express = require('express');
var router = express.Router();
const ccxt = require('ccxt');

/* GET page. */
router.get('/', async function (req, res, next) {

    var template = require("../views/index.marko");

    console.log("Routing done all fine...");
    res.marko(template, data={
      fname: "Devanshi",
      lname: "awasthi",
      host: "Vikas",
      drinks : ["Wine", "Beer", "Champagne"]});   

});
(node:49482) UnhandledPromiseRejectionWarning: TypeError: template.render is not a function
    at ServerResponse.renderMarkoTemplate [as marko] (/var/www/html/screener.market/screener.market/node_modules/@marko/express/dist/cjs/index.js:20:10)
    at /var/www/html/screener.market/screener.market/routes/index.js:39:9
    at Layer.handle [as handle_request] (/var/www/html/screener.market/screener.market/node_modules/express/lib/router/layer.js:95:5)
    at next (/var/www/html/screener.market/screener.market/node_modules/express/lib/router/route.js:137:13)
    at Route.dispatch (/var/www/html/screener.market/screener.market/node_modules/express/lib/router/route.js:112:3)
    at Layer.handle [as handle_request] (/var/www/html/screener.market/screener.market/node_modules/express/lib/router/layer.js:95:5)
    at /var/www/html/screener.market/screener.market/node_modules/express/lib/router/index.js:281:22
    at Function.process_params (/var/www/html/screener.market/screener.market/node_modules/express/lib/router/index.js:335:12)
    at next (/var/www/html/screener.market/screener.market/node_modules/express/lib/router/index.js:275:10)
    at Function.handle (/var/www/html/screener.market/screener.market/node_modules/express/lib/router/index.js:174:3)
(Use `node --trace-warnings ...` to show where the warning was created)
(node:49482) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
DylanPiercey commented 2 years ago

@YuriyTigiev that is actually the same issue. Marko 5+ components are actually compiled to use esmodule and thus also have a .default as their main export. See this: https://markojs.com/docs/marko-5-upgrade/#:~:text=const%20template%20%3D%20require(%22.%2Ftemplate.marko%22).default%3B

YuriyTigiev commented 2 years ago

Do you have simple multifile examples cjs and mjs projects for marko 5+?

Sent via the Samsung Galaxy S8+, an AT&T 5G Evolution capable smartphone Get Outlook for Androidhttps://aka.ms/AAb9ysg

From: Dylan Piercey @.> Sent: Tuesday, November 16, 2021 11:13:11 PM To: marko-js/marko @.> Cc: YuriyTigiev @.>; Mention @.> Subject: Re: [marko-js/marko] markoExpress is not a function (Issue #1753)

@YuriyTigievhttps://emea01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2FYuriyTigiev&data=04%7C01%7C%7C47c23eeae24e413efe8008d9a9352255%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637726867950116107%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=HPJkMTwVGDPgSFRTHyiZ0a%2Bm5VXUAwpMb%2F6fSaHp1YM%3D&reserved=0 that is actually the same issue. Marko 5+ components are actually compiled to use esmodule and thus also have a .default as their main export. See this: https://markojs.com/docs/marko-5-upgrade/#:~:text=const%20template%20%3D%20require(%22.%2Ftemplate.marko%22).default%3Bhttps://emea01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fmarkojs.com%2Fdocs%2Fmarko-5-upgrade%2F%23%3A~%3Atext%3Dconst%2520template%2520%253D%2520require(%2522.%252Ftemplate.marko%2522).default%253B&data=04%7C01%7C%7C47c23eeae24e413efe8008d9a9352255%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637726867950116107%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=E7JZfaMTee5bU5kS%2FyVcmF%2FrVDD99IIJ5a583hlY8rE%3D&reserved=0

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHubhttps://emea01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fmarko-js%2Fmarko%2Fissues%2F1753%23issuecomment-970587055&data=04%7C01%7C%7C47c23eeae24e413efe8008d9a9352255%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637726867950126099%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=LttwDXGxNHDetQldsJq7jc%2F7nwl7yaomhNRSnMcTKvk%3D&reserved=0, or unsubscribehttps://emea01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fnotifications%2Funsubscribe-auth%2FAFNSYQV6IXD644TGL7MDDLTUMKUMPANCNFSM5IDZD7BA&data=04%7C01%7C%7C47c23eeae24e413efe8008d9a9352255%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637726867950136091%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=PU9DSv1L9Xz9TQH5gZYGC9XHbWxVwEeSatZdxQ6g%2Fds%3D&reserved=0. Triage notifications on the go with GitHub Mobile for iOShttps://emea01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fapps.apple.com%2Fapp%2Fapple-store%2Fid1477376905%3Fct%3Dnotification-email%26mt%3D8%26pt%3D524675&data=04%7C01%7C%7C47c23eeae24e413efe8008d9a9352255%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637726867950136091%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=72WyVH0dozVN4b7rU9STxyPODSw5K%2BF474jwNWDp9iQ%3D&reserved=0 or Androidhttps://emea01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fplay.google.com%2Fstore%2Fapps%2Fdetails%3Fid%3Dcom.github.android%26referrer%3Dutm_campaign%253Dnotification-email%2526utm_medium%253Demail%2526utm_source%253Dgithub&data=04%7C01%7C%7C47c23eeae24e413efe8008d9a9352255%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637726867950146095%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=UD6VpaySHvph3L0eR81FFWkZhzarcJDA2qh2%2B5CbCdo%3D&reserved=0.

DylanPiercey commented 2 years ago

@YuriyTigiev you could checkout https://github.com/marko-js/examples/tree/master/examples/webpack-express which you can setup via:

npm init marko -- --template webpack-express
YuriyTigiev commented 2 years ago

but without the webpack and without any additional frameworks and libraries? each new thing is each new potential issue with compatibility or security.

Sent via the Samsung Galaxy S8+, an AT&T 5G Evolution capable smartphone Get Outlook for Androidhttps://aka.ms/AAb9ysg

From: Dylan Piercey @.> Sent: Tuesday, November 16, 2021 11:55:37 PM To: marko-js/marko @.> Cc: YuriyTigiev @.>; Mention @.> Subject: Re: [marko-js/marko] markoExpress is not a function (Issue #1753)

@YuriyTigievhttps://emea01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2FYuriyTigiev&data=04%7C01%7C%7Cab9c0213cdd249dba63f08d9a93b0ff2%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637726893461347867%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=dUWOr0SJefVfU2lPsZCVLx3zuMUS89P%2BlNp7F7WLylA%3D&reserved=0 you could checkout https://github.com/marko-js/examples/tree/master/examples/webpack-expresshttps://emea01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fmarko-js%2Fexamples%2Ftree%2Fmaster%2Fexamples%2Fwebpack-express&data=04%7C01%7C%7Cab9c0213cdd249dba63f08d9a93b0ff2%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637726893461357857%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=txDGLLUgfIodKx3UlQuwsgwQkueMGFOVIZ9vE3FuqEI%3D&reserved=0 which you can setup via:

npm init marko -- --template webpack-express

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHubhttps://emea01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fmarko-js%2Fmarko%2Fissues%2F1753%23issuecomment-970628589&data=04%7C01%7C%7Cab9c0213cdd249dba63f08d9a93b0ff2%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637726893461367853%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=EhuYaAjH7qbRezfr7Re3k3vDV%2BfrW9X2WFpvc0v29Lg%3D&reserved=0, or unsubscribehttps://emea01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fnotifications%2Funsubscribe-auth%2FAFNSYQVEGN7XX77I3F7A2UDUMKZLTANCNFSM5IDZD7BA&data=04%7C01%7C%7Cab9c0213cdd249dba63f08d9a93b0ff2%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637726893461367853%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=A7xtHthLpao5kUKfDHZJEVMEp0gXeKd9OyCLWwbva8Q%3D&reserved=0. Triage notifications on the go with GitHub Mobile for iOShttps://emea01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fapps.apple.com%2Fapp%2Fapple-store%2Fid1477376905%3Fct%3Dnotification-email%26mt%3D8%26pt%3D524675&data=04%7C01%7C%7Cab9c0213cdd249dba63f08d9a93b0ff2%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637726893461377843%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=R33XG%2BLxlwi6g1NIMZRY0%2FJG7MkIAxfqd8K%2Fi%2FhIIPs%3D&reserved=0 or Androidhttps://emea01.safelinks.protection.outlook.com/?url=https%3A%2F%2Fplay.google.com%2Fstore%2Fapps%2Fdetails%3Fid%3Dcom.github.android%26referrer%3Dutm_campaign%253Dnotification-email%2526utm_medium%253Demail%2526utm_source%253Dgithub&data=04%7C01%7C%7Cab9c0213cdd249dba63f08d9a93b0ff2%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C637726893461377843%7CUnknown%7CTWFpbGZsb3d8eyJWIjoiMC4wLjAwMDAiLCJQIjoiV2luMzIiLCJBTiI6Ik1haWwiLCJXVCI6Mn0%3D%7C3000&sdata=jSlwl%2B%2FA3gNP3R2AMcQgUQBfHRAgopqyAMt0xhGRlTo%3D&reserved=0.

DylanPiercey commented 2 years ago

@YuriyTigiev Marko really isn't designed to be used without some kind of bundler. We have support for webpack, rollup, vite & lasso at the moment. This is primarily because Marko automatically determines which components to bundle and send to the browser with the various bundler plugins. It is possible to use Marko w/o a bundler, but it would mean all client side functionality would not work.