堆棧內存溢出
cost 206 ms
在同構渲染中無法在模塊外使用 import 語句的錯誤

[英]Error with cannot use import statement outside of a module in isomorphic rendering

我收到一條錯誤消息，提示我無法在模塊外部使用導入語句，我已將后端文件夾中的 package json 設置為鍵入模塊，並且不相信我從前端導入應用程序時出現語法錯誤. 可能是什么問題？ 這是我的 server.js - 這是我的 app.js 我沒有使用任何轉譯器，這可能是個問題還是有另一種方法來實現 ...

Express 路由器：TypeError [ERR_INVALID_ARG_TYPE]：第一個參數必須是字符串類型

[英]Express router: TypeError [ERR_INVALID_ARG_TYPE]: The first argument must be of type string

我知道我在這個問題上苦苦掙扎。 我正在開發一個 webpack Universal React App，但我收到了這個錯誤消息，我不知道它來自哪里： 我認為這是因為 eval 參數上的 url： 在 url 中間有一個相對路徑是不好的。 這是我的 webpack 文件： 我的快遞服務器文 ...

使用 Reactjs 和 Nodejs 的同構應用

[英]isomorphic application using Reactjs & Nodejs

我有一個由 Reactjs 和 Nodejs 組成的應用程序。 我所做的是使用 Expressjs 為 CRA Reacts 應用程序提供服務，並將一些邏輯放在 Nodejs 端。 CRA 只是將請求發送到自己的前端后端，例如/api/greeting 。 我可以在 Reactjs 和 Node ...

本機 node.js 和瀏覽器加密的同構代碼

[英]isomorphic code for native node.js and browser crypto

有一個isomorphic-webcrypto假裝這樣做但沒有：它為每個目標構建單獨的構建。 有一種高貴的加密方式可以做到這一點，但它基於 if-else 條件，如果我想要一個同構的 mjs 代碼，它就會失敗。 最后，還有eval 的 require 方式來傳遞 bundler，但是 node 無法 ...

在節點瀏覽器（同構）庫中使用 stream 或任何 Node.js 庫

[英]Using stream or any Node.js library in a Node-Browser(Isomorphic) library

我正在開發一個節點瀏覽器（同構）庫，其中源代碼用 TypeScript 編寫並轉譯成 CJS 和 ES 模塊。 轉譯后的代碼按原樣發布，在發布之前未使用模塊捆綁器進行捆綁。 我需要使用來自節點核心的 stream 模塊，並且我計划將流瀏覽器 package 用於瀏覽器部分。 在庫中包含使用 Node ...

在同構 Typescript 庫中引用特定於平台的類型的正確方法

[英]Right way to reference platform-specific types in isomorphic Typescript library

我正在嘗試編寫一個 Typescript 庫，我希望能夠在同時針對瀏覽器和節點時包含該庫。 我有兩個問題：在代碼主體中引用特定於平台的類型，以及在生成的.d.ts聲明中包含這些類型，這些聲明伴隨轉譯的 JS。 在第一種情況下，我想寫類似 如果我的lib編譯器選項中不包含"dom" （也就是說，如果我 ...

webpack：express 找不到包錯誤 404

[英]webpack: express can't find bundle Error 404

我知道這個問題被問了很多，但我已經嘗試了一切，但沒有任何效果！ 事情是這樣的：我正在開發一個Isomorphic React App，用於練習 2017 年本教程的大副本，我嘗試更新它https://medium.com/@phoebe.greig/headache-free-isomorphic- ...

如何在 Sapper 中使用 Rollup 為服務器和客戶端導入不同的包？

[英]How to import a different bundle for server and client using Rollup in Sapper?

我正在創建一個啟動服務器並從服務器獲取內容並將其顯示在瀏覽器中的工具。 我正在嘗試將它與前端框架集成。 Sapper/Svelte 就是其中之一。 問題是我的包包含對瀏覽器不需要的內置模塊的導入，也沒有被瀏覽器解析，這反過來會引發錯誤。 我認為我需要做的是使我的工具同構並將我的工具分成兩個包。 ...

Nextjs + Docker-Compose：如何解析容器主機名客戶端？

[英]Nextjs + Docker-Compose: how to resolve container hostname client-side?

Docker 的新手在這里。 我的 Nextjs 應用程序遇到了一個令人困惑的障礙，該應用程序與 API 和數據庫容器一起在自己的容器中運行。 我的 Nextjs 應用使用來自 API 容器的數據。 這在服務器端工作得很好：Nextjs 應用程序會按應有的方式解析容器主機名。 但是，在客戶端，應 ...

使用 isomorphic-git 創建行差異

[英]Creating a line diff with isomorphic-git

我正在嘗試從isomorphic-git獲取 output，它類似於git diff的 GitHub 操作。 我在這里查看了git.walk實現中的map function，但我在使用它時遇到了問題。 我成功地能夠使用以下代碼走樹： 如何改進map function 並使用jsdiff將當前工作樹和 ...

如何在 Next.js 中最好地導入“僅限服務器”代碼？

[英]How to best import "server-only" code in Next.js?

在我的索引頁面的getServerSideProps function 中，我想使用從另一個本地文件導入的 function foo ，該文件依賴於某個節點庫。 所述庫不能在瀏覽器中運行，因為它依賴於“僅服務器”模塊，例如fs或request 。 我一直在使用以下模式，但想對其進行優化。 將foo ...

瀏覽器返回 403 Access Error 可能是 AWS 導致的

[英]403 Access Error returned from Browser possibly caused by AWS

我的無服務器 web 應用程序托管在 AWS amplify 上。 如果我嘗試刷新頁面，我將收到訪問被拒絕錯誤 XML。 當我查看控制台時，它沒有顯示 output。該代碼在localhost上運行良好，但會導致 403 錯誤。 我發現了一個非常相似的問題，只是我沒有使用 CloudFront。 ...

在同構 React 應用程序中減少 FID（首次輸入延遲）的好方法有哪些？

[英]What are some good ways to reduce FID (First input delay) in isomorphic React application?

在我的應用程序中非常用於指針向下事件的 FID。 它是一個同構反應應用程序。 任何人都可以提出一些減少它的好方法。 最近谷歌搜索控制台引入了速度（實驗性）。 由於高 FID（> 300 毫秒），它顯示我的大多數網站頁面都很慢。 ...

Next.JS：警告期望服務器 HTML 包含匹配<a>項</a><div> ; 如何補水？</div><div id="text_translate"><p> 我正在使用 Semantic-UI React 和 Next.JS，但它出現在斷點 &lt; 768px 處，我的 Home 組件在瀏覽器刷新時完全中斷。 我知道因為它是一個 react/next.js 應用程序，他們正在處理路由，但我想我想知道如果用戶碰巧這樣做了怎么辦？</p><p> 它不會發生在我的 /login、/register 或 /profile 路由上</p><p>所以我四處檢查以解決我的問題—— <a href="https://spectrum.chat/next-js/general/warning-expected-server-html-to-contain-a-matching-p-in-div~d2f8f623-11a5-4917-a71d-661904089193" rel="nofollow noreferrer">在這里</a>和在那篇文章中，它指向<a href="https://reactjs.org/docs/react-dom.html#hydrate" rel="nofollow noreferrer">React 文檔</a>； 為什么會發生這種情況的解釋以及解決它的處方似乎不適合我的情況。</p><blockquote><p> 與 render() 相同，但用於水合其 HTML 內容由 ReactDOMServer 渲染的容器。 React 將嘗試將事件偵聽器附加到現有標記。</p><p> React 期望服務器和客戶端之間呈現的內容是相同的。 它可以修補文本內容的差異，但您應該將不匹配視為錯誤並修復它們。 在開發模式下，React 會警告水合期間的不匹配。 無法保證在不匹配的情況下會修補屬性差異。 出於性能原因，這很重要，因為在大多數應用程序中，不匹配很少見，因此驗證所有標記的成本會非常高。</p><p> 如果單個元素的屬性或文本內容在服務器和客戶端之間不可避免地不同（例如，時間戳），您可以通過向元素添加 suppressHydrationWarning={true} 來消除警告。 它只工作一層深，旨在成為一個逃生艙口。 不要過度使用它。 除非它是文本內容，否則 React 仍然不會嘗試修補它，因此它可能會在未來更新之前保持不一致。</p><p> 如果您有意在服務器和客戶端上渲染不同的東西，您可以進行兩次渲染。 在客戶端呈現不同內容的組件可以讀取 state 變量，如 this.state.isClient，您可以在 componentDidMount() 中將其設置為 true。 這樣，初始渲染通道將渲染與服務器相同的內容，避免不匹配，但額外的通道將在水化后立即同步發生。</p></blockquote><p> 這是入口點文件： pages/index</p><pre> import React from 'react' import Head from '../components/head' import HomeLayout from '../components/Home/Home.jsx' import 'semantic-ui-css/semantic.min.css' import '../styles/styles.scss' import { connect } from 'react-redux' // import {bindActionCreators} from 'redux' // import withRedux from 'next-redux-wrapper' import { logInUser } from '../store' class Home extends React.Component { static async getInitialProps({ isLoggedIn }) { return { isLoggedIn } } render() { const { isLoggedIn } = this.props return ( &lt;div&gt; {console.log("isLoggedIn ", isLoggedIn)} &lt;Head title = 'Home' /&gt; &lt;HomeLayout isLoggedIn = { isLoggedIn }/&gt; &lt;/div&gt; ) } } export default connect(state =&gt; state)(Home);</pre><p> 這是我的pages/_app</p><pre> import React from 'react' import { Provider } from 'react-redux' import App from 'next/app' import withRedux from 'next-redux-wrapper' import { initializeStore } from '../store' export default withRedux(initializeStore)( class MyApp extends App { static async getInitialProps({ Component, ctx }) { return { pageProps: Component.getInitialProps? await Component.getInitialProps(ctx): {} } } render() { const { Component, pageProps, store } = this.props return ( &lt;Provider store={store}&gt; &lt;Component {...pageProps} /&gt; &lt;/Provider&gt; ) } } )</pre><p> 任何幫助</p></div>

[英]Next.JS: Warning Expected server HTML to contain a matching <a> in <div>; How to rehydrate?

我正在使用 Semantic-UI React 和 Next.JS，但它出現在斷點 &lt; 768px 處，我的 Home 組件在瀏覽器刷新時完全中斷。 我知道因為它是一個 react/next.js 應用程序，他們正在處理路由，但我想我想知道如果用戶碰巧這樣做了怎么辦？ 它不會發生在我的 /l ...

React/Node - 我如何找到“警告：function 僅在客戶端，在服務器端不起作用”的位置？

[英]React/Node - How can I locate where “Warning: the function is client-side only, does not work on server side” are?

我有一個 expressjs 和 react 應用程序，我想采取步驟在嬰兒步驟中制作同構。 我也試圖在嬰兒步驟中做到這一點，但我很難找到像日志這樣的位置 “警告：function 僅在客戶端，在服務器端不起作用” 來自終端日志，因為在此警告上方或下方提供的任何日志都是不相關的（顯然這不會來自客戶端 ...

使用JavaScript模塊的同構JavaScript庫-在瀏覽器中忽略Node.js依賴項嗎？

[英]Isomorphic JavaScript library using JavaScript modules - Omitting Node.js dependencies in the browser?

因此，我正在計划編寫一個程序包，希望該程序包的用戶可以在Node.js和瀏覽器中使用。 在Node.js端，它將使用fs模塊。 這可能在瀏覽器中不存在。 這可以通過CommonJS的if子句來檢查模塊所處的環境以及一個簡單的require 。 對於import ，情況並非如此，因 ...

等壓應用程序，TypeORM &amp;&amp; TypeScript &amp;&amp; Express &amp;&amp; Webpack設置問題

[英]Isomoprhic application, problem with TypeORM && TypeScript && Express && Webpack setup

我正在嘗試制作同構JavaScript應用程序。 服務器端代碼和客戶端代碼均由Webpack編譯。 當我嘗試運行包含typeorm連接的已編譯服務器端捆綁包時，出現了這樣的錯誤 錯誤 預編譯的Server.ts Webpack相關配置 共同 服務器 ...

無法追蹤 Node JS 內存泄漏

[英]Having trouble tracking down Node JS memory leak

我們正在努力解決我們第一個實質性 Node/React Isomorphic Web 應用程序的內存泄漏問題。 在 48 小時或更短的時間內，我們使用了超過 500MB 的內存。 該應用程序所做的大部分工作是從 graphql 服務器獲取 json 並使用該數據制作由 React 組件組成的網頁。 ...

如何做高效的客戶端認證？

[英]How to do efficient client-side authentication?

對於同時具有公共/未登錄視圖和管理員視圖的Web應用程序，我一直在使用完全獨立的前端（React與nginx一起提供）和后端。 將兩者分開的吸引力之一是，如果我願意，我可以完全用Go或Rust重寫后端，而完全不影響前端。 但是，要進行客戶端身份驗證，我基本上必須維護兩個不同的“狀態”：一 ...


排序:
質量:
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM