-
Notifications
You must be signed in to change notification settings - Fork 129
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Module parse failed at ./node_modules/posthog-js/dist/module.js 10:1199 #1484
Comments
We are also seeing this with the following error:
|
Our codebase was fine last week.
|
Same. We did not change anything in our codebase; we just ran the pipeline and started to encounter this issue. |
Encounterd this issue today after upgrading to 1.174.0. It appears that this issue was introduced in 1.172.0 here: #1480 Specific error I'm getting:
|
After some experimentation building posthog-js locally. The source of the issue appears to be the difference between the es5 and es6 targets in the babel-preset/env options. Namely, the IE11 target. I found that adding I'm not certain, but I think that is an indication that this older create-react-app I'm building requires that transform....potentially because its own babel loader is using the older target. With that being said, after reviewing the code, it wasn't super clear to me how I could, from my react app, select the es5 plugins. |
Thanks, I just downgraded to 1.171.0 and my project worked again (vite+quasar). |
I'm still having the issue after down grading and also after upgrading but it only happens when I'm running with the development server. I'm able to build (i.e. yarn build) but when I start the project using 'yarn start' I get the same error. Any ideas? frontend | yarn run v1.22.19 |
@robertbutleratcfusacorpcom I wanted to give this another stab this morning because I currently have some issues with the fetch wrapper and was fairly disappointed that not being able to opt into future releases meant I wouldn't be able to receive new features or a fix. Here is what I did to enable my app, using react-scripts v4 to be able to install latest version of posthog-js. Steps
Reference: config-overrides.js const { override } = require("customize-cra");
const overrideJsLoaders = () => (config) => {
const excludeRegex = /@babel(?:\/|\\{1,2})runtime/;
config.module.rules = config.module.rules.map((rule) => {
if (rule.oneOf) {
rule.oneOf = rule.oneOf
.filter((oneOf) => {
return !oneOf.test?.toString().includes("js");
})
.concat({
test: /\.(js|mjs|jsx|ts|tsx)$/,
exclude: excludeRegex,
use: {
loader: "babel-loader",
options: {
presets: [
[
"@babel/preset-env",
{ targets: ">0.5%, last 2 versions, Firefox ESR, not dead, IE 11" },
],
],
plugins: ["@babel/transform-react-jsx"],
babelrc: false,
configFile: false,
compact: false,
cacheDirectory: true,
cacheCompression: false,
cacheIdentifier:
"production:[email protected]:[email protected]:[email protected]:[email protected]",
sourceMaps: true,
inputSourceMap: true,
},
},
});
}
return rule;
});
return config;
};
module.exports = override(overrideJsLoaders()); There are several ways to do this, but I noticed my config had multiple rules transpiling the same files and I just wanted to simplify it. So I removed those loaders with the filter then a simple one based on a copy of the original to cover all js files. I'm sure there is a better way, I just didn't want to spend my whole day on it. The main fix was forcing the preset to use the es5 build targets (IE 11) I mentioned before. Hope this helps! |
Downgrading to |
@matt-peck I really appreciate your effort. I'll let you know if that fixes it! |
@matt-peck I tried your suggestion and I'm getting this error now when I startup. It doesn't really explain what babel plugins I need to install. Maybe I'm misunderstanding the complete solution. Did you intend that I should install that babel transform plugin as well? frontend | yarn run v1.22.19 |
“Can’t resolve babel-loader”, can you try installing babel-loader….i think I was using version 7
…--
Sent from Mobile
On Thursday, Oct 31, 2024 at 3:11 PM, robertbutleratcfusacorpcom ***@***.*** ***@***.***)> wrote:
@matt-peck (https://github.com/matt-peck) I tried your suggestion and I'm getting this error now when I startup. It doesn't really explain what babel plugins I need to install. Maybe I'm misunderstanding the complete solution. Did you intend that I should install that babel transform plugin as well?
frontend | yarn run v1.22.19
frontend | $ react-app-rewired start
frontend | ℹ 「wds」: Project is running at http://172.17.0.9/
frontend | ℹ 「wds」: webpack output is served from
frontend | ℹ 「wds」: Content not from webpack is served from /app/public
frontend | ℹ 「wds」: 404s will fallback to /
frontend | Starting the development server...
frontend |
frontend | Failed to compile.
frontend |
frontend | multi .***@***.***/react-refresh-webpack-plugin/client/ReactRefreshEntry.js ./node_modules/react-dev-utils/webpackHotDevClient.js ./src/index.js
frontend | Module not found: Can't resolve 'babel-loader' in '/app'
—
Reply to this email directly, view it on GitHub (#1484 (comment)), or unsubscribe (https://github.com/notifications/unsubscribe-auth/AELTDJF6AQLGCPJFQO67DMTZ6J6EJAVCNFSM6AAAAABQE6KS3GVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDINJQGYZTINRZGM).
You are receiving this because you were mentioned.Message ID: ***@***.***>
|
I believe it's already installed as was indicated in the original error I was sharing: frontend | ./node_modules/posthog-js/dist/module.js 574:12 But, I'll try it again and install babel loader to see if that makes any difference. |
@matt-peck Although installing babel loader did make a difference I'm not sure it's for the better. I'm getting an error parsing code which used to work just fine. I had assumed that babel-loader was already installed but after installing per your suggestion I can see that there was no entry for 'babel-loader' in the package.json file. In any case it doesn't seem to like our code and I feel like I'd be opening up a can of worms going down this road. I appreciate your help though. frontend | yarn run v1.22.19 |
This issue has 2129 words at 16 comments. Issues this long are hard to read or contribute to, and tend to take very long to reach a conclusion. Instead, why not:
Is this issue intended to be sprawling? Consider adding label |
@matt-peck I have made some progress since my last comment. It turns out the parsing error was pretty minor and I was able to fix that error by removing the "URLSearchParams" type hinting. Now the project starts up but I immediately get the following error when I browse to the site. ReferenceError: React is not defined After doing some digging I found some reference to using the @babel/preset-react plugin with the runtime: "automatic" setting. I added the configuration to the config-overrides.js example you gave me by adding an entry to the options: presets: collection as follows:
That didn't seem to help but not sure if that was the correct way to enable the plugin. Let me know if you have any ideas about how to fix that. |
@matt-peck So this morning I gave this another shot and realized that I have two different lock files for my application. I have a lock file for yarn and another for npm. To be honest I can't even remember how I originally installed PostHog (i.e. via npm or yarn). But after updating both of them to the latest version, 1.181.0 it works again. Appreciate all of your help! |
Getting the same error here using Vue 2 with webpack. Upgrading from 1.161.6 -> 1.172.0 failed likely because of the es6 upgrade. Why isnt this listed as a breaking change? I am currently importing in my main.js file as so: import posthogPlugin from "./plugins/posthog"; // import the plugin Is their update docs that show how to import them using ES6? |
same problem |
Same problem here... |
I encountered a similar issue when upgrading posthog-js due to the addition of core-js dependencies, for posthog-js - core-js "^3.38.1", for nuxt 2.18.1 - core-js@^3.37.1 & |
This didn't work for me, perhaps I need some additional Babel extensions and/or "loader" packages, or config? |
you can try this in vue.config.js: |
I'm using Nuxt. If I add that to
|
for Nuxt - #1484 (comment) |
Ah, I'd missed that one. However, that solution isn't working for me, but this is: # nuxt.config.js
build: {
...
extend(config) {
config.module.rules.push({
test: /\.js$/,
include: /node_modules\/posthog-js/,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env'],
},
},
})
},
...
}, |
that worked for me too, turns out i have a tonne of other modules that needed transpiling such as: transpileDependencies: ['pretty-bytes','nanoid','vue-flatpickr-component','posthog-js'], |
This worked for my Nuxt 2 project, thanks! |
We followed the following steps:
Step 1: Installed the latest posthog-js version, that is, 1.174.0
Step 2: We added
import posthogJS from 'posthog-js'
inside one js fileStep 3: We ran the
npm run build
commandStep 4: Received
Module parse failed at ./node_modules/posthog-js/dist/module.js 10:1199
errorPlease check the attached image for more info.
Note: when we remove posthog from the codebase, then the
npm run build
command succeededNote: We are currently using v12.22.7 node version.
The text was updated successfully, but these errors were encountered: