For some reason I should use Node.js 6.x (actually 6.10.0) and I'm trying to run koa2 with Babel as described here. My code looks like this
const Koa = require('koa');
var app = new Koa();
// --- middlewares ---
async function a(){await 1} // okay here!
console.log(a());
const serve = require('koa-static');
app.use(serve('./web'));
app.use(require('koa-cookie').default());
app.use(require('koa-bodyparser')()); // fails here
And I'm getting error
D:\Project\node_modules\koa-bodyparser\index.js:72
return async function bodyParser(ctx, next) {
^^^^^^^^
SyntaxError: Unexpected token function
Running node with nodemon index.js --exec babel-node on Windows
Works perfect on Node 7.x, but I need to use 6 unfortunately :(
async and await are not yet supported in Node.js 6.x. They are ES2017 features and are only supported in Node 7.6+.
The Babel preset you're using is obviously not working - make sure you are using the correct babel preset (ES2017) as per the instructions on the Babel site.
Related
This question already has an answer here:
Fetch error when building Next.js static website in production
(1 answer)
Closed last year.
I have a very simple NextJS 9.3.5 project.
For now, it has a single pages/users and a single pages/api/users that retrieves all users from a local MongoDB table
It builds fine locally using 'next dev'
But, it fails on 'next build' with ECONNREFUSED error
page/users
import fetch from "node-fetch"
import Link from "next/link"
export async function getStaticProps({ params }) {
const res = await fetch(`http://${process.env.VERCEL_URL}/api/users`)
const users = await res.json()
return { props: { users } }
}
export default function Users({ users }) {
return (
<ul>
{users.map(user => (
<li key={user.id}>
<Link href="/user/[id]" as={`/user/${user._id}`}>
<a>{user.name}</a>
</Link>
</li>
))}
</ul>
);
}
pages/api/users
import mongoMiddleware from "../../lib/api/mongo-middleware";
import apiHandler from "../../lib/api/api-handler";
export default mongoMiddleware(async (req, res, connection, models) => {
const {
method
} = req
apiHandler(res, method, {
GET: (response) => {
models.User.find({}, (error, users) => {
if (error) {
connection.close();
response.status(500).json({ error });
} else {
connection.close();
response.status(200).json(users);
}
})
}
});
})
yarn build
yarn run v1.22.4
$ next build
Browserslist: caniuse-lite is outdated. Please run next command `yarn upgrade`
> Info: Loaded env from .env
Creating an optimized production build
Compiled successfully.
> Info: Loaded env from .env
Automatically optimizing pages ..
Error occurred prerendering page "/users". Read more: https://err.sh/next.js/prerender-error:
FetchError: request to http://localhost:3000/api/users failed, reason: connect ECONNREFUSED 127.0.0.1:3000
Any ideas what is going wrong ? particularly when it works fine with 'next dev' ?
Thank you.
I tried the same few days ago and didn't work... because when we build the app, we don't have localhost available... check this part of the doc - https://nextjs.org/docs/basic-features/data-fetching#write-server-side-code-directly - that said: "You should not fetch an API route from getStaticProps..." -
(Next.js 9.3.6)
Just to be even more explicit on top of what Ricardo Canelas said:
When you do next build, Next goes over all the pages it detects that it can build statically, i.e. all pages that don't define getServerSideProps, but which possibly define getStaticProps and getStaticPaths.
To build those pages, Next calls getStaticPaths to decide which pages you want to build, and then getStaticProps to get the actual data needed to build the page.
Now, if in either of getStaticPaths or getStaticProps you do an API call, e.g. to a JSON backend REST server, then this will get called by next build.
However, if you've integrated both front and backend nicely into a single server, chances are that you have just quit your development server (next dev) and are now trying out a build to see if things still work as sanity check before deployment.
So in that case, the build will try to access your server, and it won't be running, so you get an error like that.
The correct approach is, instead of going through the REST API, you should just do database queries directly from getStaticPaths or getStaticProps. That code never gets run on the client anyways, only server, to it will also be slightly more efficient than doing a useless trip to the API, which then calls the database indirectly. I have a demo that does that here: https://github.com/cirosantilli/node-express-sequelize-nextjs-realworld-example-app/blob/b34c137a9d150466f3e4136b8d1feaa628a71a65/lib/article.ts#L4
export const getStaticPathsArticle: GetStaticPaths = async () => {
return {
fallback: true,
paths: (await sequelize.models.Article.findAll()).map(
article => {
return {
params: {
pid: article.slug,
}
}
}
),
}
}
Note how on that example, both getStaticPaths and getStaticProps (here generalized HoC's for reuse, see also: Module not found: Can't resolve 'fs' in Next.js application ) do direct database queries via sequelize ORM, and don't do any HTTP calls to the external server API.
You should then only do client API calls from the React components on the browser after the initial pages load (i.e. from useEffect et al.), not from getStaticPaths or getStaticProps. BTW, note that as mentioned at: What is the difference between fallback false vs true vs blocking of getStaticPaths with and without revalidate in Next.js SSR/ISR? reducing client calls as much as possible and prerendering on server greatly reduces application complexity.
The VScode Jest extension fails to run the the tests with output:
module.exports = (filename, opts = {}) => {
^
SyntaxError: Unexpected token =
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:374:25)
Starting Jest in Watch mode failed too many times and has been stopped.
see troubleshooting: https://github.com/jest-community/vscode-jest/blob/master/README.md#troubleshooting
I'm using webpack as described here: https://jestjs.io/docs/en/webpack
The problem is the system's node version.
vscode-jest runs on the system node, ignoring NVM versions.
To fix this make sure your system's node version is set to the specific node version your project is running, in my case it needs v8.16.0.
In order to upgrade your system's node (in case you are using Ubuntu) follow the next instructions:
https://github.com/nodesource/distributions/blob/master/README.md#deb
I'm using Puppeteer and I'd like to access the HeadlessExperimental domain.
I can enable the domain, but if I try calling beginFrame, I get this error message:
content-generator-api-0 | Error: Protocol error (HeadlessExperimental.beginFrame):
Command is only supported if BeginFrameControl is enabled.
Here is the code I'm running
const browser = await puppeteer.launch(...)
const page = await browser.newPage()
await page.goto(url)
const cdp = await page.target().createCDPSession()
await cdp.send('HeadlessExperimental.enable')
const frameData = await cdp.send('HeadlessExperimental.beginFrame', {screenshot: {}})
I have the following chromium flags set, as suggested in "Rendering in Headless Chrome"
'--enable-surface-synchronization',
'--run-all-compositor-stages-before-draw',
'--disable-threaded-animation',
'--disable-threaded-scrolling',
'--disable-checker-imaging',
Judging by a description found in the chromium.org forum, my guess is that I'll need to modify the Puppeteer lib to support creating targets with BeginFrameControl.
Currently, the BeginFrameControl is only supported in headless mode
and can only be enabled at target creation time.
Also, the stable release of Puppeteer is running chromium revision 594312, but it looks like the HeadlessExperimental wasn't patched in until 612061, which isn't included in any of the current chromium releases
Add --enable-begin-frame-control switch to chrome launch parameters
I'm trying to do navigation test in protractor and don't see any consitency with the baseUrl in the config and the url used in the test.
protractor.conf.js
exports.config = {
baseUrl: 'http://localhost:4200/'
}
navbar.e2e-spec.ts
import { NavbarPage } from './navbar.po';
import * as protractor from './../protractor.conf.js';
describe('navbar', () => {
let navbar: NavbarPage;
const baseUrl = protractor.config.baseUrl;
beforeEach(() => {
navbar = new NavbarPage();
browser.get('/');
});
it(`should see showcase nav item, be able to (click) it,
and expect to be navigated to showcase page`, () => {
const anchorShowcase = navbar.anchorShowcase;
expect(anchorShowcase.isDisplayed()).toBe(true);
anchorShowcase.click();
browser.waitForAngular();
expect(browser.getCurrentUrl()).toBe(baseUrl + '/showcase');
});
});
Although when I run the e2e test it uses a different port:
** NG Live Development Server is listening on localhost:49154, open your browser on http://localhost:49154/ **
Why is the test url set to port 49154. This apparently seems to be the default if you start a new angular-cli project: https://github.com/angular/angular-cli
How can I get control over the baseUrl / Or is http://localhost:49154/ safe to use for all my angular cli projects?
By default when you do ng e2e the command take --serve value as true. It means it will build and serve at that in a particular URL. Not the baseUrl you passed in protractor.conf.js
that is why, you are getting a random URL served when testing you app like http://localhost:49154/
Now as you don't want build during test and want to test existing build (URL) like http://localhost:4200/ you need to pass --no-serve in your command line and it will pick baseUrl from the protractor.conf.js
you can also pass baseUrl in the command line like below. note that this not baseUrl but --base-href=
ng e2e --no-serve --base-href=https://someurl.com:8080
When running Angular CLI's ng e2e command, it states in the wiki that the default port will be random, as seen here:
https://github.com/angular/angular-cli/wiki/e2e
Under the serve submenu.
The e2e command can take in all the same arguments as serve so to keep the port the same just pass in --port my-port-number to the ng e2e command.
As far as that port being safe to use, I wouldn't use it, it is just a random port after all. I would stick to the default unless you have a use-case for changing it. The port is mainly relevant for the dev server, not so much for where ever the production code runs.
Aniruddha Das's solution doesn't work anymore as this option isn't there from Angular CLI 6.x version, you can try following -
ng e2e --dev-server-target=
please see following reference
I'm doing the tutorial of basic fulfillment and conversation setup of api.ai tutorial to make a bot for facebook messenger, and when I try to deploy the function with the command:
gcloud beta functions deploy testBot --stage-bucket testbot-e9bc4.appspot.com --trigger-http
(where 'testBot' is the name of the project and 'testbot-e9bc4.appspot.com' is the bucket_name, I thought..)
It return the following error message:
ERROR: (gcloud.beta.functions.deploy) OperationError: code=3, message=Source code size exceeds the limit
I've searched but not found any answer, I don't know where is the error.
this is the JS file that appear in the tutorial:
/
HTTP Cloud Function.
#param {Object} req Cloud Function request context.
#param {Object} res Cloud Function response context.
*/
exports.helloHttp = function helloHttp (req, res) {
response = "This is a sample response from your webhook!" //Default response from the webhook to show it's working
res.setHeader('Content-Type', 'application/json'); //Requires application/json MIME type
res.send(JSON.stringify({ "speech": response, "displayText": response
//"speech" is the spoken version of the response, "displayText" is the visual version
}));
};
Make sure you are in the correct directory where your go code resides before executing gcloud beta functions deploy testBot --stage-bucket testbot-e9bc4.appspot.com --trigger-http command.
I was working in the express project. In my case, I mistakenly installed the #google/storage package in devDependencies instead of dependencies. I unable to notice as I tested the project in debug mode using mocha. So in debug, it is able to find that package in devDependencies but on deploy function, it tries to find in dependencies in package.json but unable to find there.
Open command prompt at the location where index.js was created and run the above gcloud command.