hi everyone, I am trying to use a responsive email...
# help
m
hi everyone, I am trying to use a responsive email framework, mjml, in my lambda function together with vue ssr. However, it only seems to work in development mode but not when deployed. I have narrowed it down to the mjml package. Spent days on this and can't to resolve it. Any ideas?
Copy code
import mjml2html from "mjml";
import { createSSRApp } from "vue";
import { renderToString } from "@vue/server-renderer";
import { newRequestTemplate } from "./templates/new-request-template"; // This is just an mjml template
export async function handler(event) {
  const email_data = JSON.parse(event.body); // input data
  try {
    const app = createSSRApp({
      data() {
        return email_data;
      },
      template: newRequestTemplate,
    });

    // Tell Vue to recognize mjml components. See: <https://v3.vuejs.org/api/application-config.html#iscustomelement>
    app.config.compilerOptions.isCustomElement = (tag) => tag === "mjml" || tag.startsWith("mj-");

    // Render the Vue instance to a variable as a string
    let html = await renderToString(app);

    // Remove <!--[--> and <!--]--> add by the server renderer.
    html = html.replace("<!--[-->", "").replace("<!--]-->", "");

    // Let mjml do its magic
    const res = mjml2html(html);
    return {
      statusCode: 200,
      headers: { "Content-Type": "html" },
      body: res.html,
    };
  } catch (error) {
    console.log(":rocket: ~ file: lambda.js ~ line 32 ~ handler ~ error", error);
    return {
      statusCode: 200,
      headers: { "Content-Type": "html" },
      body: null,
    };
  }
} 
The Error I get is this : { "errorType": "Runtime.ImportModuleError", "errorMessage": "Error: Cannot find module '../lib/utils.js'\nRequire stack:\n- /var/task/src/lambda.js\n- /var/runtime/UserFunction.js\n- /var/runtime/index.js", "stack": [ "Runtime.ImportModuleError: Error: Cannot find module '../lib/utils.js'", "Require stack:", "- /var/task/src/lambda.js", "- /var/runtime/UserFunction.js", "- /var/runtime/index.js", " at _loadUserApp (/var/runtime/UserFunction.js:100:13)", " at Object.module.exports.load (/var/runtime/UserFunction.js:140:17)", " at Object.<anonymous> (/var/runtime/index.js:43:30)", " at Module._compile (internal/modules/cjs/loader.js:999:30)", " at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10)", " at Module.load (internal/modules/cjs/loader.js:863:32)", " at Function.Module._load (internal/modules/cjs/loader.js:708:14)", " at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:60:12)", " at internal/main/run_main_module.js:17:47" ] }
t
Can you try adding mjml under nodeModules
In the function bundle.nodeModules property
m
let me try...
Works like a charm! so simple 😂 Thank you, thank you, thank you