天道酬勤,学无止境

server-side-rendering

Webpack config for SSR SCSS

I have a React-TypeScript SSR app where I used SCSS files for my styling. I need to write a rule in Webpack to load the SCSS and I haven't been able to do it. I found various solutions online, all of which are extremely complex and use things like mini-css-extract-plugin. I couldn't get any of them to work. I currently have two webpack config files, one for the client (web) and one for the server (node), both of which load the SCSS as such: { test: /\.scss$/, use: ["css-loader", "sass-loader"] } I also encountered another issue in that I can't use style-loader as it throws an error about the

2022-05-03 05:55:53    分类:问答    reactjs   webpack   sass   server-side-rendering

Angular Universal meta tags not visible in page source

When I view a page where the title and meta tags are set in the constructor of my angular universal project, the title displays in the tab, and I can see the meta tags and title in the html when I click "inspect element" and go to the head of the html document. However, if you solely click "View Page Source", the tags do not appear, nor does the title. The only things that appear are the original code in index.html. The universal project compiles fine except when a page is loaded it throws the error "Error: Cannot find module './view/view.module.ngfactory'." Perhaps this error has something to

2022-05-03 05:17:22    分类:问答    angular   seo   universal   server-side-rendering

self is not defined in ionic angular server side rendering

I am following https://ionicframework.com/blog/ssr-with-angular-universal-and-ionic this tutorial everything setup is successfully done and also these command run sucessfully npm run build:ssr and npm run serve:ssr then they give me port for run website in browser Node Express server listening on http://localhost:4000, but when open this port in chrome I got the error ERROR ReferenceError: self is not defined ReferenceError: self is not defined at Object.607 (F:\ionic4-project\app\dist\2.js:44:9) at __webpack_require__ (F:\ionic4-project\app\dist\server.js:26:30) at __webpack_require__.t (F

2022-05-03 05:12:31    分类:问答    angular   ionic-framework   ionic4   server-side-rendering   angular-universal

p:radioButton with render rule is never rendered

EDIT: I adjusted the code, but the problem remains. See below I have this p:selectOneRadio: <p:selectOneRadio value="#{bean.val}" id="val" layout="custom" > <f:selectItem itemLabel="" itemValue="A" /> <f:selectItem itemLabel="" itemValue="B" /> <p:ajax update="wrapper AData" /> </p:selectOneRadio> and this p:radioButton: <h:panelGroup id="wrapper"> <p:radioButton for="val" itemIndex="0" rendered="#{bean.val != 'A'}"/> </h:panelGroup> and AData contains other inputs. They are displayed only if the first radio is selected. But this is not important. When I get a fresh page, both the radios are

2022-05-03 03:13:54    分类:问答    jsf   primefaces   radio-button   server-side-rendering

nextJS SSR useRouter() does not work when refresh page

I am using nextJS SSR in my project. Now when I try to use the following code to get page parameters then it shows undefined. function About() { const router = useRouter(); const { plan_id } = router.query; console.log(plan_id) } export default About; It works when the page is routed from some other page (without page reload with "next/link") but it does not work when I refresh the page. Can someone please help?

2022-05-02 22:11:28    分类:问答    next.js   server-side-rendering   dynamic-routing   next-router

Is there any way to avoid "Text content did not match" warning in SSR with React?

I have set up a SSR environment with webpack and HMR. There is a statically rendered markup, that server passes to the client and a client.js bundle with ReactDOM.hydrate() method. If I change my source code, HMR works fine, but issues a warning in console, saying that there's a mismatch between client code and static markup. I am using an express server with webpack-dev-middleware and webpack-hot-middleware My webpack config looks like this: module.exports = { mode: 'development', entry: ['webpack-hot-middleware/client', './src/client.js'], devServer: { hot: true, publicPath: '/' }, plugins:

2022-05-02 21:14:45    分类:问答    reactjs   express   server-side-rendering

NuxtJS Static generated HTML page does not load Javascript when calling /index.html

I'm working on a nuxtjs project which will be generated for static usage. Of course it uses Javascript for e.g. the Navigation, some forms and more. When I am using the page with npm run dev everything works fine. After exporting with npm run build && npm run generate I deploy the generated content from /dist to my server (cdn requested by user, in that case Google Cloud Storage) I can use the page without any problems if I dont add the index.html suffix. Example: Visiting https://page.com/subpage/ works fine but Visiting https://page.com/subpage/index.html not really. Yes it renders the

2022-05-02 20:05:15    分类:问答    javascript   vue.js   nuxt.js   server-side-rendering

Conditional redirection in Next.js

Is it possible to conditionally redirect a user to another Url based on cookie value? I know I can inspect cookie on a server & then redirect. But what should I do if a user came through Link. (I can't use Route.push because it's undefined on the server) Is there any way to use Router only on the browser? I know at least one way to do this: to create simple button and add Router push & check cookies inside onClick handler, but is it a correct way to do this?

2022-05-02 18:59:53    分类:问答    javascript   reactjs   server-side-rendering   nextjs

this.debug is not a function Angular Universal

I'm applying SSR in my project by using Angular 10. I've found that lot of people recommend using domino. Below is my server.ts file ... import { existsSync, readFileSync } from 'fs'; import { createWindow } from 'domino'; const scripts = readFileSync('dist/video-website-angular/browser/index.html').toString(); const window = createWindow(scripts); global['window'] = window; import { AppServerModule } from './src/main.server'; import { APP_BASE_HREF } from '@angular/common'; ... When I run npm run dev:ssr, I get the error

2022-05-02 14:51:39    分类:问答    angular   express   server-side-rendering   angular-universal   angular10

How can we prevent this.debug is not a function from causing the compiler to exit

In reference to the question asked here this.debug is not a function Angular Universal . it is correct that this.debug is not a function is just a side effect, however such error leads the compiler to stop (when watching) during the development. How can I prevent such behavior on such errors? Also, it sometimes just randomly simply stops, see screenshot below, it shows compilation complete then angular is listening then after I refreshed the UI, it just simply stopped no errors nothing. I think it might be related to nguniversal, I created https://github.com/angular/universal/issues/2200 issue

2022-05-02 10:06:33    分类:问答    angular   server-side-rendering