Repository: arnog/mathlive

Issue #1218: Not Able to import mathlive in angular version 8.0 project
Created: 2021-10-18T11:58:13Z
Im getting errors in my terminal when i try to import mathlive in my angular project.
When i try to import like this:
import { MathfieldElement, Mathfield} from 'mathlive';
or
import { MathfieldElement} from 'mathlive';
I get this error in my terminal:

My package.json:
{
"name": "modulus",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"ng": "ng",
"build": "ng build --outputPath ../Modulus.Client.Web/dist",
"build:prod": "ng build --outputPath ../Modulus.Client.Web/dist --prod",
"build:container": "ng build --outputPath ./build --prod",
"build:ci": "node --max_old_space_size=2048 node_modules/@angular/cli/bin/ng build --outputPath ../Modulus.Client.Web/dist --configuration=ci",
"watch": "ng build --outputPath ../Modulus.Client.Web/dist --watch",
"build-osx": "ng build --outputPath ../Modulus.Client.Web/dist",
"build-osx:prod": "ng build --prod --build-optimizer --outputPath ../Modulus.Client.Web/dist",
"watch-osx": "ng build --outputPath ../Modulus.Client.Web/dist --watch",
"analyze": "ng build --stats-json && webpack-bundle-analyzer dist/stats.json",
"test": "ng test --browsers Chrome_no_sandbox",
"test-debug": "ng test --watch --browsers Chrome_with_debugging",
"lint": "ng lint",
"e2e": "ng e2e",
"extract": "ngx-translate-extract --input ./src --output ./src/assets/i18n/*.json --clean --sort --format namespaced-json",
"postinstall": "patch-package && node ./src/assets/tinymce-formula/copy-tinymce-formula.ts",
"compodoc": "npx compodoc -p src/tsconfig.json"
},
"private": true,
"typings": "./src/typings.d.ts",
"dependencies": {
"@angular/animations": "8.2.0",
"@angular/cdk": "^7.3.7",
"@angular/common": "8.2.0",
"@angular/compiler": "8.2.0",
"@angular/core": "8.2.0",
"@angular/forms": "8.2.0",
"@angular/material": "^7.3.7",
"@angular/platform-browser": "8.2.0",
"@angular/platform-browser-dynamic": "8.2.0",
"@angular/router": "8.2.0",
"@ctrl/ngx-codemirror": "^4.1.0",
"@microsoft/signalr": "5.0.6",
"@nc-stil/sds-lib": "^8.1.0-beta.50",
"@ngx-translate/core": "^11.0.1",
"@ngx-translate/http-loader": "^4.0.0",
"@nicky-lenaers/ngx-scroll-to": "^2.0.0",
"angular2-chartjs": "0.5.1",
"angular2-hotkeys": "2.1.4",
"angular2-multiselect-dropdown": "4.6.9",
"bootstrap": "4.3.1",
"buffer": "^6.0.3",
"class-validator": "0.9.1",
"codemirror": "^5.60.0",
"core-js": "2.5.7",
"dkfds-plugins": "^5.3.0",
"flatpickr": "4.6.2",
"focus-trap": "^6.6.1",
"font-awesome": "4.7.0",
"html2canvas": "1.0.0-alpha.10",
"jquery": "3.5.1",
"mathlive": "^0.69.7",
"moment": "2.24.0",
"ng2-dnd": "^5.0.2",
"ng2-pdf-viewer": "^6.3.2",
"ng2-select2": "1.0.0-beta.10",
"ngx-bootstrap": "^5.3.2",
"ngx-toastr": "^10.2.0",
"platform": "1.3.5",
"popper.js": "1.15.0",
"rxjs": "6.5.2",
"select2": "4.0.13",
"tinymce": "4.9.11",
"tinymce-formula": "^1.1.0",
"tslib": "^1.11.0",
"zone.js": "~0.10.0"
},
"devDependencies": {
"@angular-devkit/build-angular": "0.803.29",
"@angular/cli": "8.2.0",
"@angular/compiler-cli": "8.2.0",
"@angular/language-service": "8.2.0",
"@biesbjerg/ngx-translate-extract": "^4.2.0",
"@types/jasmine": "2.8.8",
"@types/jasminewd2": "2.0.3",
"@types/node": "10.14.14",
"@types/select2": "4.0.44",
"@types/signalr": "^2.2.36",
"codelyzer": "^5.2.1",
"fs-extra": "^10.0.0",
"handlebars": "^4.7.7",
"jasmine-core": "2.8.0",
"jasmine-spec-reporter": "4.2.1",
"karma": "^4.4.1",
"karma-chrome-launcher": "^3.1.0",
"karma-cli": "^2.0.0",
"karma-coverage-istanbul-reporter": "^2.0.5",
"karma-jasmine": "^2.0.1",
"karma-jasmine-html-reporter": "^1.4.2",
"karma-junit-reporter": "^2.0.1",
"node-sass": "^4.14.1",
"patch-package": "6.1.2",
"protractor": "5.1.2",
"puppeteer": "^8.0.0",
"ts-node": "8.3.0",
"tslint": "5.18.0",
"typescript": "^3.5.3",
"webpack-bundle-analyzer": "3.4.1"
}
}

Duplicate issue #1253: Hi, I want to use mathlive for my project, but couldn't add it to my angular project (angular 12). Please help me adding it to the project
Created: 2021-11-28T07:15:43Z
Description
[Describe the bug or feature]
[Include screenshots, screen recordings, code fragments or CodePen. If you get
an error message, include the text of the error message, not a screen capture of
it.]
[If you use Vue, React or some other framework, include a link to a minimal
project demonstrating the issue.]
[To quickly build a demo project, consider

(https://github.com/mindreframer/mathlive-bug-issue-templates)
(https://github.com/mindreframer/mathlive-create-app) ]

Steps to Reproduce
[Provide steps that are specific and repeatable]

[First Step]
[Second Step]
[And so on...]

Actual Behavior
[What happens when you follow the steps above?]
[If there are any error messages, include the exact text shown. Some error
messages may be displayed in the Javascript console. Copy and paste them. Do not
include a screenshot of the error messages.]
Expected Behavior
[What did you expect to happen insteead?]
[Is this a regression: did it use to work in a previous version?]
Environment
MathLive version
Operating System [macOS, Windows, iOS. Include the version]
Browser [Safari, Chrome, IE, Firefox, etc... Try several browsers and note
if there are differences between browsers. Include the version number of the
browsers.]

Closing comment (2021-11-28T18:52:14Z): I have a few suggestions:

When you want to respond or add some information to an already open issue, there is no need to open a new issue (#1254). You can simply comment on the existing issue, including asking that the issue be reopened, if necessary.
Avoid filing duplicate issues. In particular, it seems that this issue is substantially similar to #1218. In general, before open a new issue, it is good etiquette to search the existing open issues to see if there is already one open.
When opening a new issue a template is provided for you to fill out. This is your chance to provide as much information as possible to make resolving the issue easier, in particular indicating clear steps to reproduce. In your case this would include making available a project that can demonstrate the problem you are running into. Without this information, it is very difficult to resolve issues.
Luckily, in this case, since this is an already reported issue, you already have suggested solution to try out. I have repeated them above. Did you try the first or second one?