After update to v2.2.0, the example https://nuxtjs.org/api/nuxt-render/ doesnot work on express
But it works ok on nuxt-edge . More info: https://cmty.app/nuxt/nuxt.js/issues/c7985

After update to v2.2.0, the example https://nuxtjs.org/api/nuxt-render/ doesnot work on express
But it works ok on nuxt-edge . More info: https://cmty.app/nuxt/nuxt.js/issues/c7985

I try to deploy my website to netlify but not successful. It seems impossible to execute the command
npm run generate

Since Webpack 4, there seems to be an issue with this project. I've been following the documentation on the readme.

• Vue-CLI 2.1 is installed

When running npm run dev an error about eslint-loader is showing. It seems nuxt is still installing Webpack 4 and leads me to believe its throwing all the dependencies into version warns and out of whack.

Further to tweaking to try and fix myself, Ive attempted:

• To revert my eslint-loader package to @1.9.0
• To revert my webpack to @3.12.0

But pussyfooting around with more errors. Theoretically this should just work, right?

Nothing to preview

Hi,

I tried to run this template on Azure Web Apps.
But it was failed.

I found that the issue is caused by the Web Apps architecture (e.g. using iisnode and Named Pipe, and restriction of connection to 'localhost' ).

Especially, named pipe (and unix pipe) is not supported by latest(1.4.2) of nuxt.js.
It will be supported from this commit of 2.x.

Do you have any plans to change version of nuxt.js?

F.Y.I.
I published two repositories.
horihiro/nuxt.js is forked from v1.4.2 of nuxt.js to add support of named pipe.
horihiro/nuxt-express-azure-webapps is generared by this template, and is added some commits to run on Azure WebApps.

Hi,
I am using nuxt-edge with express server via nuxt.config.js serverMiddleware and I want to use aliases (~, ~~) in imports in the same way as on the frontend (e. g. in vue templates).

Is it even possible to use them? Because in this repo they are not used https://github.com/nuxt-community/express-template/blob/master/template/api/index.js#L7.

Thanks

If I use alias, the nuxt throws an error Cannot find module '~/router/router'.

Works: import router from './router/router';
Doesn't work import router from '~/router/router';

express.js index file

'use strict';

import express from 'express';
import bodyParser from 'body-parser';

import router from '~/router/router';
import log from '~/helpers/logger';

const app = express();

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());

app.use(router);

// catch pm2 shutdown signal
process.on('SIGINT', () => {
  log.info('Service graceful shutdown');
});

export default {
  path: '/api',
  handler: app
};

nuxt.config.js

export default {
  rootDir: __dirname, 
  router: {
    middleware: 'lang'
  },
  // server api
  serverMiddleware: ['~/server/index.js'],
  axios: {
    browserBaseURL: '/'
  },
  modules: [
    '@nuxtjs/axios',
    '@nuxtjs/pwa'  
    ]
  ]
};

Just a quick question hopefully. Since the ExpressJS changes and removal of Backpack, there is no longer a Build/main.js to point to. Most of our apps end up with going through Plesk using Passenger which require an entry point which I can seem to work out since the changes. Hope that makes sense, cheers

I'm using this template for a while and every thing was OK. The setup is like this:
for authentication on the server, I'm using passport and express-session.

In the nuxtServerInit, I was trying to check if user is authenticated:
if (req.isAuthenticated())

After updated the app to use the new approach of setting server as serverMiddleware, now the nuxt app don't have access to req.session or req.isAuthenticated(). Basically it don't have access to server req object and for checking if user authenticated, I've created an api endpoint and in the nuxtServerInit, sending an api request and getting user object.

Other stuff like accessing authenticated router endpoints on the server is working perfectly.

After lots of googling, was not able to find any solutions. Not sure if this is issue or does it suppose to be like that.

Note: The README is still not updated for the latest changes. For example it still mentions backpack have been used, but it is removed.

What needs to be configured?

Can you give an example?

Please

Could example to use Mongodb in this?

When using this template (and this code below in the API folder, does it completely ignore the nuxt.config.js file? I am running express with Nuxt and it seems this is the case. The config file is completely ignored.

// We instantiate Nuxt.js with the options const isProd = process.env.NODE_ENV === 'production' const nuxt = new Nuxt({ dev: !isProd }) // No build in production if (!isProd) { const builder = new Builder(nuxt) builder.build() } app.use(nuxt.render) app.listen(3000) console.log('Server is listening on http://localhost:3000')

I have used nuxt.js in my project, use nginx as the proxy, but there is a problem，when the amount of visits is very large, 504 errors often occur.

Then I have do a benchmark of the nuxt.js project, here are the report:

# init the project with express-template, the lastest.
vue init nuxt-community/express-template express-nuxt

When the project up, It looks like this:

Jmeter params:

<?xml version="1.0" encoding="UTF-8"?>
<jmeterTestPlan version="1.2" properties="4.0" jmeter="4.0 r1823414">
  <hashTree>
    <TestPlan guiclass="TestPlanGui" testclass="TestPlan" testname="Test Plan" enabled="true">
      <stringProp name="TestPlan.comments"></stringProp>
      <boolProp name="TestPlan.functional_mode">false</boolProp>
      <boolProp name="TestPlan.tearDown_on_shutdown">true</boolProp>
      <boolProp name="TestPlan.serialize_threadgroups">false</boolProp>
      <elementProp name="TestPlan.user_defined_variables" elementType="Arguments" guiclass="ArgumentsPanel" testclass="Arguments" testname="User Defined Variables" enabled="true">
        <collectionProp name="Arguments.arguments"/>
      </elementProp>
      <stringProp name="TestPlan.user_define_classpath"></stringProp>
    </TestPlan>
    <hashTree>
      <ThreadGroup guiclass="ThreadGroupGui" testclass="ThreadGroup" testname="Thread Group" enabled="true">
        <stringProp name="ThreadGroup.on_sample_error">continue</stringProp>
        <elementProp name="ThreadGroup.main_controller" elementType="LoopController" guiclass="LoopControlPanel" testclass="LoopController" testname="Loop Controller" enabled="true">
          <boolProp name="LoopController.continue_forever">false</boolProp>
          <intProp name="LoopController.loops">-1</intProp>
        </elementProp>
        <stringProp name="ThreadGroup.num_threads">200</stringProp>
        <stringProp name="ThreadGroup.ramp_time">1</stringProp>
        <boolProp name="ThreadGroup.scheduler">false</boolProp>
        <stringProp name="ThreadGroup.duration"></stringProp>
        <stringProp name="ThreadGroup.delay"></stringProp>
      </ThreadGroup>
      <hashTree>
        <HTTPSamplerProxy guiclass="HttpTestSampleGui" testclass="HTTPSamplerProxy" testname="HTTP Request" enabled="true">
          <elementProp name="HTTPsampler.Arguments" elementType="Arguments" guiclass="HTTPArgumentsPanel" testclass="Arguments" testname="User Defined Variables" enabled="true">
            <collectionProp name="Arguments.arguments"/>
          </elementProp>
          <stringProp name="HTTPSampler.domain">10.9.34.121</stringProp>
          <stringProp name="HTTPSampler.port">3000</stringProp>
          <stringProp name="HTTPSampler.protocol">http</stringProp>
          <stringProp name="HTTPSampler.contentEncoding"></stringProp>
          <stringProp name="HTTPSampler.path">/</stringProp>
          <stringProp name="HTTPSampler.method">GET</stringProp>
          <boolProp name="HTTPSampler.follow_redirects">true</boolProp>
          <boolProp name="HTTPSampler.auto_redirects">false</boolProp>
          <boolProp name="HTTPSampler.use_keepalive">true</boolProp>
          <boolProp name="HTTPSampler.DO_MULTIPART_POST">false</boolProp>
          <stringProp name="HTTPSampler.embedded_url_re"></stringProp>
          <stringProp name="HTTPSampler.connect_timeout"></stringProp>
          <stringProp name="HTTPSampler.response_timeout"></stringProp>
        </HTTPSamplerProxy>
        <hashTree>
          <ResultCollector guiclass="StatGraphVisualizer" testclass="ResultCollector" testname="Aggregate Graph" enabled="true">
            <boolProp name="ResultCollector.error_logging">false</boolProp>
            <objProp>
              <name>saveConfig</name>
              <value class="SampleSaveConfiguration">
                <time>true</time>
                <latency>true</latency>
                <timestamp>true</timestamp>
                <success>true</success>
                <label>true</label>
                <code>true</code>
                <message>true</message>
                <threadName>true</threadName>
                <dataType>true</dataType>
                <encoding>false</encoding>
                <assertions>true</assertions>
                <subresults>true</subresults>
                <responseData>false</responseData>
                <samplerData>false</samplerData>
                <xml>false</xml>
                <fieldNames>true</fieldNames>
                <responseHeaders>false</responseHeaders>
                <requestHeaders>false</requestHeaders>
                <responseDataOnError>false</responseDataOnError>
                <saveAssertionResultsFailureMessage>true</saveAssertionResultsFailureMessage>
                <assertionsResultsToSave>0</assertionsResultsToSave>
                <bytes>true</bytes>
                <sentBytes>true</sentBytes>
                <threadCounts>true</threadCounts>
                <idleTime>true</idleTime>
                <connectTime>true</connectTime>
              </value>
            </objProp>
            <stringProp name="filename"></stringProp>
          </ResultCollector>
          <hashTree/>
        </hashTree>
      </hashTree>
    </hashTree>
  </hashTree>
</jmeterTestPlan>

The result:

When i use vue-ssr like vue-hackernews-2.0, the same Jmeter params, but the result is very different:

Then I try the express-generator to create a project, express -e, here is the result:

The result is that nuxt.js based vue-ssr is very slow, the Jmeter Throughput is just 320/sec.

Is there something wrong with my benchmark or something what let nuxt.js slow? Need some help!!!

Thanks~

Hello,
I try to use this template but, while instalition i cant sind folder 'server'. What is the reason ?

Hello,
I try to use this template but, while instalition i cant sind folder 'server'. What is the reason ?

I'd like to see if anyone else has had success and whether there's an "official way" to do this. In order to get it working I had to first create an key and cert using the following command

openssl req \
    -newkey rsa:2048 \
    -x509 \
    -nodes \
    -keyout key.pem \
    -new \
    -out cert.pem \
    -subj /CN=localhost \
    -reqexts SAN \
    -extensions SAN \
    -config <(cat /System/Library/OpenSSL/openssl.cnf \
        <(printf '[SAN]\nsubjectAltName=DNS:localhost')) \
    -sha256 \
    -days 3650

Then I created a server.js file in the project with the following code

const { Nuxt, Builder } = require('nuxt');
const app = require('express')();
const http = require('http');
const https = require('https');
const fs = require('fs-extra');

let server;

const isProd = (process.env.NODE_ENV === 'production');
const port = process.env.PORT || 3000;

// Prepare for HTTP or HTTPS
if (process.env.NODE_ENV !== 'production') {
  const pkey = fs.readFileSync('./key.pem');
  const pcert = fs.readFileSync('./cert.pem');
  const httpsOptions = {
    key: pkey,
    cert: pcert,
  };
  server = https.createServer(httpsOptions, app);
} else {
  server = http.createServer(app);
}

// We instantiate nuxt.js with the options
const config = require('./nuxt.config.js');

config.dev = !isProd;
const nuxt = new Nuxt(config);

// Render every route with Nuxt.js
app.use(nuxt.render);

function listen() {
  // Listen the server
  // app.listen(port, '0.0.0.0');
  server.listen(port, 'localhost');
  console.log(`Server listening on localhost:${port}.`);
}

// Build only in dev mode with hot-reloading
if (config.dev) {
  new Builder(nuxt).build()
    .then(listen)
    .catch((error) => {
      console.error(error);
      process.exit(1);
    });
} else {
  listen();
}

And finally I changed the npm run dev command from nuxt to NODE_ENV=development node server.js in package.json

When you run dev for the first time it'll say the site isn't secure when you go to https://localhost:3000. I used the following instructions to allow the cert.pem file to be trusted by my machine: https://stackoverflow.com/questions/7580508/getting-chrome-to-accept-self-signed-localhost-certificate#answer-15076602

Is there any reason not to do it this way? If so, what's the best way? Thanks!

Unfortunately, When I handled the function of uploading the picture, I found a problem here, I don't know which folder should be uploaded, because I had uploaded picture in a folder, but can't access it with URL.
I've tried the static folder, still cannot be accessed.
I hope to help me, thanks very much!

rt, when I excute "npm install", and run dev, It's show

But when I change some data, hot reloading not work