Reputation: 753
I want to deploy a nextjs typescript project to vercel but include a shared folder that exists in the root. So my folders are arranged as:
/client
/universal-packages
/server
Within client is the nextjs project with pages etc. I have next build in the run script in package.json. tsconfig (within /client)
{
"compilerOptions": {
"target": "es5",
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "preserve",
"sourceMap": true,
"paths": {
"shared/*": ["packages-universal/shared/*"]
},
"incremental": true,
"baseUrl": "..",
},
"include": [
"pages",
"src",
"types",
"constants",
"../packages-universal/shared",
],
"exclude": [
"node_modules"
]
}
next.config.js
const path = require("path");
module.exports = {
productionBrowserSourceMaps: true,
webpack: (config) => {
config.resolve.alias = {
...config.resolve.alias,
shared: path.resolve(__dirname, "../packages-universal/shared"),
};
config.module.rules.push({
test: /\.tsx?$/,
include: path.resolve(__dirname, "../packages-universal/shared"),
use: "babel-loader",
});
return config;
},
};
I then import like:
import type { Personality } from 'shared/types';
However when vercel builds from the /client folder the shared folder is not included.
I have been stuck on this for days.I was manually copying folders between client and server with the git commit hook! but I'd really like to be able to actually understand this.
Upvotes: 1
Views: 14