I know this is not the first question about nrwl nx.
Thanks to this thread: #545, I figured out how to run the start project of payloadcms in NX monorepo. And this is the working repo: https://github.com/Stupidism/seo-mono.
However, when I tried to move the public-demo into my new repo, I met many new errors, I tried to fix them
export
I cannot pass the third one and It's weird that only this ts file payload/components/forms.ts
is throwing error.
I guess I'm making a very stupid mistake. I tried the following search words but got no luck for now.
webpack how to parse export in node_modules
,webpack SyntaxError: Unexpected token 'export'
Just clone this repo and switch to the new branch:
git clone git@github.com:Stupidism/seo-mono.git
pnpm i
And then run the project:
nx run seo-payload:serve
You will see this error:
/Users/.../.pnpm/payload@0.17.2_zxu4lunrffi22uinww7slmpxf4/node_modules/payload/components/forms.ts:1
export {
^^^^^^
SyntaxError: Unexpected token 'export'
at compileFunction (<anonymous>)
at Object.compileFunction (node:vm:352:18)
at wrapSafe (node:internal/modules/cjs/loader:1033:15)
at Module._compile (node:internal/modules/cjs/loader:1069:27)
at Module._compile (/Users/stupidism/Documents/seo-mono/node_modules/.pnpm/pirates@4.0.5/node_modules/pirates/lib/index.js:136:24)
at Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
at Object.newLoader [as .ts] (/Users/stupidism/Documents/seo-mono/node_modules/.pnpm/pirates@4.0.5/node_modules/pirates/lib/index.js:141:7)
at Module.load (node:internal/modules/cjs/loader:981:32)
Thanks in advance, this is the first key step for us to migrate from contentful to payloadCMS.
It might need a configuration in payload.admin.webpack
to modify the babel config. My solution now is:
// babel.config.js
module.exports = {
presets: [
[
'@babel/preset-env',
{
modules: 'commonjs',
targets: {
node: "current",
},
},
],
'@babel/preset-typescript',
'@babel/preset-react',
],
};
import { buildConfig } from 'payload/config';
import _ from 'lodash';
import babelConfig from '../babel.config';
import { Articles } from './collections/Articles';
import { Authors } from './collections/Authors';
@@ -7,14 +10,42 @@ import { ColdArticles } from './collections/ColdArticles';
import { Media } from './collections/Media';
import { Users } from './collections/Users';
import { environment } from './environments/environment';
import { ContextField } from './collections/CoontextField';
export default buildConfig({
serverURL: environment.payload.serverUrl,
admin: {
// the user collection slug to use for authenticating to the admin panel, one per express app
user: Users.slug,
webpack: (config) => {
return _.merge({}, config, {
module: {
rules: [
{
// Override the babel loader
// test: /\.(t|j)sx?$/,
// exclude: /node_modules[\\/](?!(@payloadcms[\\/]payload)[\\/]).*/,
use: [
{
// loader: 'babel-loader',
options: babelConfig,
},
],
},
],
},
});
},
Hey @Stupidism — I just followed your reproduction steps and everything worked exactly as expected for me. Opened up in browser and everything.
Payload's webpack config should deliver you everything you need to parse export
automatically.
Generally, when we see unexpected token 'export'
there is something with your Babel configuration that is incorrect. Try and completely remove your node_modules
folder and delete any lock
files. Then reinstall dependencies.
Hi @jmikrut, just double confirm did u skipped this branch checkout step?
git checkout feng/copy-public-demo-and-run
PS: As u said about the the babel issue, I'm trying to set the babel path for in payload config. because the babel file path in nx is not in to root directory of the project
No, I checked out the branch and it worked perfectly actually!
But I still see this error and asked my colleague to try and he got the same error as well. Really weired.
Is it possible that it's related to system environment? Can u run nx report
to verify the environment? mine is:
nx report
Node : 16.15.1
OS : darwin x64
pnpm : 7.1.9
nx : 14.1.9
@nrwl/angular : Not Found
@nrwl/cypress : 14.1.9
@nrwl/detox : Not Found
@nrwl/devkit : Not Found
@nrwl/eslint-plugin-nx : 14.1.9
@nrwl/express : 14.1.9
@nrwl/jest : 14.1.9
@nrwl/js : Not Found
@nrwl/linter : 14.1.9
@nrwl/nest : Not Found
@nrwl/next : Not Found
@nrwl/node : 14.1.9
@nrwl/nx-cloud : Not Found
@nrwl/nx-plugin : Not Found
@nrwl/react : 14.1.9
@nrwl/react-native : Not Found
@nrwl/schematics : Not Found
@nrwl/storybook : Not Found
@nrwl/web : 14.1.9
@nrwl/workspace : 14.1.9
typescript : 4.6.4
Turned out it's related to pnpm. Detailed explanation in this thread: #665
Star
Discord
online
Get help straight from the Payload team with an Enterprise License.