Hi I just started playing around with nextjs to see if it fits my use case. I wanted to export the site with some dynamic routes.
My pages folder structure is like below
page
locales
[locale]
[slug].js
When I run next develop I can access the page at http://localhost:3000/locales/de-DE/summer-dress-f.
So now im trying to export the page with next.config.js like
module.exports = {
exportPathMap: function() {
return {
"/locales/de-DE/summer-dress-f": {
page: "/locales",
query: { locale: "de-DE", slug: "summer-dress-f" }
}
};
}
};
next build runs fine but when I run next export I get the error
Error: Cannot find module for page: /locales
at pageNotFoundError (/Users/bmathew/Desktop/workspace/next-demo/node_modules/next-server/dist/server/require.js:13:17)
Any ideas what am I missing here?
Running npm install seems to fix this.
Finally figured it out. The pathmap should look like
module.exports = {
exportPathMap: function() {
return {
"/locales/de-DE/summer-dress-f": {
page: "/locales/[locale]/[slug]",
query: { locale: "de-DE", slug: "summer-dress-f" }
}
};
}
};
Page component naming should be unique.
So I had about.tsx with name: AboutPage and faqs.tsx with name: AboutPage as well, amending faqs.tsx to be unique fixed it :)
I just hit a similar error, and I had simply forgotten to run next build before next export!
In my case, I solved a similar issue by deleting 'node_modules' by running rm -rf node_modules and installed the packages again.
In my case, I was using getStaticProps and getStaticPaths. fallback prop was set to false. Changing it to true fixed the issue.
I had this vague error message when I had capitals in the file name WIP-sidebar.js.
In my case, running:
npm i --save --legacy-peer-deps
fixed the issue.
Sometimes the problem happens when we are building and we have another terminal running yarn dev
Related
I've just upgraded my project to Meteor v2.6 along with all packages. Everything runs smoothly on local so I pushed to Galaxy where I'm promptly met by this error when trying to load my app:
Nothing in the codebase itself was changed, needless to say the routes have been defined and have been working fine before.
Here's an excerpt of the code:
import "/imports/ui/layouts/dashboardLayout/dashboardLayout";
import "/imports/ui/layouts/landingLayout/landingLayout";
import "/imports/ui/pages";
import "/imports/ui/pages/landing/landingHeader/landingHeader";
if (Meteor.isClient && Meteor.isProduction) {
Router.plugin("reywood:iron-router-ga");
}
Router.configure({
trackPageView: true,
});
Router.onAfterAction(() => {
window.scrollTo(0, 0);
});
Router.route("/", {
name: "landing",
layoutTemplate: "landingLayout",
action: function () {
this.render("landingHeader", { to: "header" });
this.render("landingContent", {
to: "content",
data: { signUp: !!this.params.query.signUp },
});
},
});
Below the diff in the versions file>
Given it runs fine locally but has issues in Production, I wonder whether the problem is this bit of code here:
if (Meteor.isClient && Meteor.isProduction) {
Router.plugin("reywood:iron-router-ga");
}
I don't know why it's there (it's not my code originally) but I've noticed that the reywood:iron-router-ga version seems to have been downgraded for some reason during the upgrade:
When I try to force an update to reywood:iron-router-ga in the vain hope that by getting it back to v2.0.1 it will start working again, I get the message that "The specified packages are at their latest compatible versions".
Has anyone encountered this before/any idea what's going on? I'm not a fan of forcing different behaviour in Production from Dev as that obviously makes testing difficult/pointless - unless there's a good reason for it. Can anyone shed any light?
When I try to modify pages/_document.js to add the FastClick event registration (see below) it complains that ReferenceError: document is not defined. I guess it's because it's executed on the server and the document is not defined there. Any way to resolve it?
if ('addEventListener' in document) {
document.addEventListener('DOMContentLoaded', function() {
FastClick.attach(document.body)
}, false)
}
pages/_document.js only rendered on server according to next.js documentation.
I suggest to use that code in pages/_app.js which will be shared between all components.
you can use process.browser to make sure your code is being executed in the front end only.
if (process.browser) {
document.addEventListener('DOMContentLoaded', function() {
FastClick.attach(document.body)
}, false)
}
I want to refer to my earlier question: Meteor Dynamic Template not working
Using components in my app is working just fine on all other pages except on the root path:
FlowRouter.route('/', {
action() {
BlazeLayout.render('mainLayout', { content: 'home' });
},
});
The same components are working just fine here.
FlowRouter.route('/dashboard', {
action() {
BlazeLayout.render('mainLayout', { content: 'dashboard' });
},
});
I have imported the same components in both home.js and dashboard.js. The location of the files are the same and the imports are identical. My components work on all pages, but not if is root path.
Any help will be greatly appreciated. Thank you!
This was actually solved by a complete reboot. I tried restarting the application multiple times without luck.
I'm a student learning meteor.js.
iron:router is using:
this.route('postEdit', {
path: '/posts/:_id/edit',
data: function() {
console.log(this.params._id);
return Posts.findOne(this.params._id); }
});
And this error is displayed:
this.params._id value is undefined76kndYuWd2KDX2eeE...
Why does undefined has that stick value?
postEdit call has:
Edit
Originally, it was 76kndYuWd2KDX2eeE due to URL being localhost:3000/posts/undefined76kndYuWd2KDX2eeE/edit...
Please, help me. Thank you.
Please update to iron#1.0.9, that should fix it.
Apparently this is a problem with iron:router#1.0.8, just run meteor update again and it will automatically update to the latest version of iron:router which solves this problem.
https://github.com/iron-meteor/iron-router/issues/1359
Ok I'm trying to make a package from a Phaser game, been researching this for a couple of days, but it doesn't seem to work.
I think I identified the problem though, hopefully somebody can help me with this!
I set everything up to make use of a local package, which all works.
Untill I'm preloading an asset.
This is my Menu class
Menu = function() {
console.log(this);
}
Menu.prototype = {
preload: function(){
this.load.image('background', 'assets/background.png');
console.log("ok in preload");
},
create: function(){
this.background = this.game.add.sprite(0, 0, 'background');
console.log("ok in create");
var text = "We're getting there";
var style = { font: "23px Arial", fill: "#ff0044", align: "center" };
var t = game.add.text(game.world.centerX, 0, text, style);
},
};
and I call this by doing
game = new Phaser.Game(400, 300, Phaser.AUTO, "gameWindow");
game.state.add('menu', Menu);
game.state.start('menu');
which all seems to work by looking at the console logs, as long as I don't try to load the image in the preload function, if I do it just keeps stuck in the preload function.
The background.png is located at my root folder going 'public/assets/background.png'.
So I'm thinking when I try to access this from a local package, it is having trouble getting there...
my package.js is this btw:
Package.describe({
summary: "game one"
});
Package.on_use(function (api, where) {
api.use(['phaserio'], 'client');
api.add_files(['states/menu.js'],
['client']);
api.export('Menu', ['client']);
});
Anybody out there, that sees what I'm doing wrong?
Thanks in advance!
you should be able to load public images from the app, but it depends when that preload sequence is running. Packages get parsed first. So is your new game created within a Meteor.startUp ->? by which time the app itself is initialized?
Also you can put assets in the package itself.
are you using 0.9? there are some issues with paths for static assets inside packages
see this thread:
https://github.com/meteor/meteor/issues/2602
for 0.9 packages you'll have to add a bit more info
Package.describe({
summary: "phaser for meteor",
version: '0.0.1',
git: 'https://github.com/dcsan/package-dev',
name: "YOURNAME:phaser"
});
currently if you use something like replacing colon with an underscore:
/packages/YOURNAME_phaser/added/path/to/asset.png
if you get phaser wrapped i would also be interested, so please publish it to atmosphere!