Stackblitz, Angular Including JSON file not working - json

I'm using Stackblitz: https://stackblitz.com/edit/bible-talk
I'm using Angular 10.
I'm trying to import data from a JSON file.
I found an example on how to do this on Stackblitz:
https://stackblitz.com/edit/json-import-example?file=src%2Fapp%2Fapp.component.html
You're supposed to add these to compiler options to tsconfig.json:
"resolveJsonModule": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true
I've done that: https://github.com/JaredMathis/bible-talk/commit/449f6269b85bb53eb5aa245bd709075db4307163
I'm still getting this error:
Error in src/app/app.component.ts (2:18)
Cannot find module '../assets/kjv/John.json' or its corresponding type declarations.
I made a brand-new Stackblitz. It works there. https://stackblitz.com/edit/json-import-not-working?file=tsconfig.json

Stackblitz does not support static assets at the moment.
See: https://github.com/stackblitz/core/issues/72
Workaround: You have to host your static assets somewhere else and link them in your code appropriately.

Your I think import in your github version is wrong, it starts with ./ where as your working stackblitz does not.
import data from './../assets/John.json';
Try removing the first ./

Related

module pygame has no init member pylint [duplicate]

This is the code I have:
import pygame
pygame.init()
I'm very confused because if I try to run the file, then there seems to be no issue, but pylint says the following:
E1101:Module 'pygame' has no 'init' member
I have searched thoroughly for a solution to this "error". In every relevant case I found, the solution was to make sure that I have not made another file or folder with the name "pygame", because in that case, I would just be importing my own file or folder.
However, I have not made a folder or file with a name even close to "pygame", so I don't know what the problem is.
As said earlier, it seems like I'm able to run the file without any issues and having errors like this confuses me in my learning process.
I write code in Visual Studio Code, I'm using python 3.6, I'm using pygame 1.9.3 and have updated my pylint. Any help would be appreciated.
Summarizing all answers.
This is a security measure to not load non-default C extensions.
You can white-list specific extension(s).
Open user settings and add the following between {}:
"python.linting.pylintArgs": [
"--extension-pkg-whitelist=extensionname" // comma separated
]
You can allow to "unsafe load" all extensions.
Open user settings and add the following between {}:
"python.linting.pylintArgs": [
"--unsafe-load-any-extension=y"
]
If you have VS code, go in your .vscode folder > settings.json or search for python.linting.mypyArgs Under user settings tab paste inbetween curly braces
"python.linting.pylintArgs": [
"--extension-pkg-whitelist=lxml" // The extension is "lxml" not "1xml"
]
I no longer see the pyinit error.
I had the same issue when I started using Visual Studio Code with Python. It has nothing to do with having another pygame.py or not installing it properly. It has to do with the fact that Visual Studio Code takes your code literally, and since you cannot import pygame.init(), it thinks that it isn't a correct module.
To fix this, open up settings.json (go into your settings, and click the {} icon) and paste
"python.linting.pylintArgs": [
"--extension-pkg-whitelist=pygame"
]
to it.
I had the same issue with one of my modules. This is what I did to resolve the problem. (I'm using visual studio on windows 10)
Press CTRL+SHIFT+P in visual studio
Choose "Preferences: Open Settings (JSON)"
Add "python.linting.pylintArgs": ["--generate-members"] below one of the lines (put a comma if necessary)
Save the .json file (CTRL+S)
For me, the code looks like this :
{
"breadcrumbs.enabled": false,
"editor.minimap.enabled": false,
"python.pythonPath": "C:\\Users\\xxx\\Anaconda3",
"terminal.integrated.rendererType": "dom",
"window.menuBarVisibility": "default",
"workbench.activityBar.visible": false,
"workbench.statusBar.visible": true,
"python.linting.pylintArgs": ["--generate-members"], //line to add
"[json]": {
}
}
Hope it helps.
Credit to #Alamnoor on github
This answer includes the answer to your question. In short it explains:
Pylint imports modules to effectively identify valid methods and attributes. It was decided that importing c extensions that are not part of the python stdlib is a security risk and could introduce malicious code.
and as a solution it mentions, among others:
Disable safety using the .pylintrc setting unsafe-load-any-extensions=yes.
See here for more information about pylint.rc. Quickest method is to just create the file .pylintrc in your project directory or your home directory.
I found adding this in settings.json() solves the problem.
"python.linting.pylintArgs":[
"--extension-pkg-whitelist=pygame",
"--erros-only"
]
I find an answer and it really works for me.
See the accepted answer and change it to extension-pkg-whitelist=lxml
pylint 1.4 reports E1101(no-member) on all C extensions
I recommend going to the view tab, clicking command palette and searching preferences: open settings.json. Then add a comma on the last line of code.Below that paste this:
"python.linting.pylintArgs": [
"--extension-pkg-whitelist=extensionname" // comma separated
]
Then save your document (ctrl + s).
Check if you have a python file named pygame.py created by you in your directory. If you do, then the import pygame line is importing your own file instead of the real Pygame module. Since you don't have an init() function in that file, you're seeing this particular error message.
I found a solution, modifying the most voted answer:
"python.linting.pylintArgs": [
"--extension-pkg-whitelist=pygame"
]
Replaced the "lxml" with "pygame".
Disable Pylint
1.Press ctrl + shift + p
2.Then type Disable Pylint
If you are using vscode then you can go to settings:
python.linting.pylintEnabled = False
It will fix the problem. If you aren't using vscode then you can go the command prompt and manually uninstall pylint with the command
pip uninstall pylint.

Python pygame lastest versions: Visual Studio Code shows missing module [duplicate]

I am using the following setup
macOS v10.14 (Mojave)
Python 3.7.1
Visual Studio Code 1.30
Pylint 2.2.2
Django 2.1.4
I want to use linting to make my life a bit easier in Visual Studio Code. However, for every import I have states "unresolved import". Even on default Django imports (i.e. from django.db import models).
I presume it is because it is not seeing the virtual environment Python files.
Everything works just fine, but it's starting to get annoying.
The interpreter choices I have are all system versions of Python. It does not seem to see my virtual environment Python at all (it is not in the same directory as my workspace, so that part makes sense).
If I set up the python.PythonPath in the settings.json file, it just ignores it and does not list my virtual environment path as an option. I also tried setting it up in my global Python settings, but it also does not show up.
Is there a quick fix to get it working?
The accepted answer won't fix the error when importing own modules.
Use the following setting in your workspace settings .vscode/settings.json:
"python.autoComplete.extraPaths": ["./path-to-your-code"],
Reference: Troubleshooting, Unresolved import warnings
In your workspace settings, you can set your Python path like this:
{
"python.defaultInterpreterPath": "/path/to/your/venv/bin/python",
}
Alternative way: use the command interface!
Cmd/Ctrl + Shift + P → Python: Select Interpreter → choose the one with the packages you look for:
This issue has already been opened on GitHub:
Python unresolved import issue #3840
There are two very useful answers, by MagnuesBrzenk and SpenHouet.
The best solution for now is to create a .env file in your project root folder. Then add a PYTHONPATH to it like this:
PYTHONPATH=YOUR/MODULES/PATH
And in your settings.json add:
"python.envFile": ".env"
When I do > reload window that fixes it.
Reference: Python unresolved import issue #3840, dkavraal's comment
None of the solutions worked except this one. Replacing "Pylance" or "Microsoft" in the settings.json solved mine.
"python.languageServer": "Jedi"
You need to select the interpreter associated with the virtual environment.
Click here (at the bottom status bar):
And just select the virtual environment you are working with. Done.
Sometimes, even with the interpreter selected, it won't work. Just repeat the process again and it should solve it.
If you have this code in your settings.json file, delete it:
{
"python.jediEnabled": false
}
If you are more visual like myself, you can use the Visual Studio Code configurations in menu File → Preferences → Settings (Ctrl + ,). Go to Extensions → Python.
In the section Analysis: Disabled, add the suppression of the following message: unresolved-import:
I was able to resolved this by enabling jedi in .vscode\settings.json
"python.jediEnabled": true
Reference from https://github.com/Microsoft/vscode-python/issues/3840#issuecomment-456017675
I wonder how many solutions this problem have (or have not), I tried most of the above, nothing worked, the only solution that worked is to set the python language server to Jedi, instead of Microsoft in the settings.json file:
"python.languageServer": "Jedi"
None of the previous answers worked for me. Adding both of the lines below to my settings.json file did, however.
"python.analysis.disabled": [
"unresolved-import"
],
"python.linting.pylintArgs": ["--load-plugin","pylint_protobuf"]
The first line really just hides the linting error. Certainly not a permanent solution, but de-clutters the screen.
This answer gave me the second line: VS Code PyLint Error E0602 (undefined variable) with ProtoBuf compiled Python Structure
Maybe someone who understands Python more than me can explain that one more.
Okay, so 2 years down the line, I have ran into this annoying problem. All I can seen here are some really complicated workarounds. Here are easy to follow steps for anyone else who might just run into this later on:
at the bottom of VS Code where you see the Python version listed, just click there
Select Interpreter windows is going to appear
click on the first option that says "Select Interpreter Path" and navigate to the folder path which has your Virtual Environment
That's all you need to do and avoid tampering with those settings in VS Code which might get very complicated if not handled with caution.
My solution
This solution is only for the current project.
In the project root, create folder .vscode
Then create the file .vscode/settings.json
In the file setting.json, add the line (this is for Python 3)
{
"python.pythonPath": "/usr/local/bin/python3",
}
This is the example for Python 2
{
"python.pythonPath": "/usr/local/bin/python",
}
If you don't know where your Python installation is located, just run the command which python or which python3 on the terminal. It will print the Python location.
This example works for dockerized Python - Django.
I was facing the same problem while importing the project-related(non standard) modules.
Detailed explanation of the problem
Directory structure:
Project_dir:
.vscode/settings.json
dir_1
> a
> b
> c
dir_2
> x
> y
> z
What we want:
Project_dir
dir_3
import a
import y
Here "import a" and "import y" fails with following error:
Import "dir_1.a" could not be resolvedPylancereportMissingImports
Import "dir_2.y" could not be resolvedPylancereportMissingImports
What worked for me:
Appending the top directory which contains the modules to be imported.
In above example add the follwoing "Code to append" in ".vscode/settings.json"
Filename:
.vscode/settings.json
Code to append:
"python.analysis.extraPaths": [dir_1, dir_2]
The solution from Shinebayar G worked, but this other one is a little bit more elegant:
Copied from Python unresolved import issue #3840:
Given the following example project structure:
workspaceRootFolder
.vscode
... other folders
codeFolder
What I did to resolve this issue:
Go into the workspace folder (here workspaceRootFolder) and create a .env file
In this empty .env file, add the line PYTHONPATH=codeFolder (replace codeFolder with your folder name)
Add "python.envFile": "${workspaceFolder}/.env" to the settings.json
Restart Visual Studio Code
To me the problem was related with the project that I was working on. It took me a while to figure it out, so I hope this helps:
Original folder structure:
root/
__init__.py # Empty
folder/
__init__.py # Empty
sub_folder_b/
my_code.py
sub_folder_c/
another_code.py
In another_code.py:
from folder.sub_folder_b import my_code.py
This didn't trigger the intellisense in Visual Studio Code, but it did execute OK.
On the other hand, adding "root" on the import path, did make the intellisense work, but raised ModuleNotFoundError when executing:
from root.folder.sub_folder_b import my_code.py
The solution was to remove the _init_.py file inside the "folder" directory, leaving only the _init_.py located at /root.
This works for me:
Open the command palette (Ctrl + Shift + P) and choose "Python: Select Interpreter".
Doing this, you set the Python interpreter in Visual Studio Code.
None of the answers here solved this error for me. Code would run, but I could not jump directly to function definitions. It was only for certain local packages. For one thing, python.jediEnabled is no longer a valid option. I did two things, but I am not sure the first was necessary:
Download Pylance extension, change python.languageServer to "Pylance"
Add "python.analysis.extraPaths": [ "path_to/src_file" ]
Apparently the root and src will be checked for local packages, but others must be added here.
I am using the following setup: (in Apr 2021)
macos big sur
vscode
Anaconda 3 (for environment)
And I faced this error during starting of the Django.
So, I follow these steps and this error is resolved.
Steps are given in these screenshots:
Open settings (workspace)
Follow this screenshot to open Python Path
Now, click Edit in settings.json
Make path like given in this screenshot /opt/anaconda3/bin/python
5. Now, save this settings.json file.
6. Restart the vscode
Also, intellisense might not work for some time hold on wait for some time and then restart again then vscode reads file for new path.
That happens because Visual Studio Code considers your current folder as the main folder, instead of considering the actual main folder.
The quick way to fix is it provide the interpreter path to the main folder.
Press Command + Shift + P (or Ctrl + Shift + P on most other systems).
Type Python interpreter
Select the path where you installed Python in from the options available.
Changing
Python:Language Server
to 'Jedi' worked for me.
It was 'Windows' initially.
For me, it worked, if I setup the paths for python, pylint and autopep8 to the local environment paths.
For your workspace add/change this:
"python.pythonPath": "...\\your_path\\.venv\\Scripts\\python.exe",
"python.linting.pylintPath": "...\\your_path\\.venv\\Scripts\\pylint.exe",
"python.formatting.autopep8Path": "...\\your_path\\.venv\\Scripts\\autopep8.exe",
Save and restart VS Code with workspace.
Done!
I have a different solution: my Visual Studio Code instance had picked up the virtualenv stored in .venv, but it was using the wrong Python binary. It was using .venv/bin/python3.7; using the switcher in the blue status bar.
I changed it to use .venv/bin/python and all of my imports were resolved correctly.
I don't know what Visual Studio Code is doing behind the scenes when I do this, nor do I understand why this was causing my problem, but for me this was a slightly simpler solution than editing my workspace settings.
In case of a Pylint error, install the following
pipenv install pylint-django
Then create a file, .pylintrc, in the root folder and write the following
load-plugins=pylint-django
I have faced this problem in three ways. Although for each of them a solution is available in the answers to this question, I just thought to put it all together.
First I got an "Unresolved Import" while importing some modules and I noticed that my installations were happening in global pip instead of the virtual environment.
This issue was because of the Python interpreter. You need to select the interpreter in Visual Studio Code using Shift + Ctrl + P and then type Select Python Interpreter. Select your venv interpreter here.
The second issue was: The above change did not resolve my issue completely. This time it was because of file settings.json. If you don't have the settings.json file in your project directory, create one and add the following line in that:
{
"python.pythonPath": "apis/bin/python"
}
This will basically tell Visual Studio Code to use the Python interpreter that is in your venv.
The third issue was while importing a custom Python module or file in another program. For this you need to understand the folder structure. As Python in venv is inside bin, you'll need to specify the folder of your module (most of the time the application folder). In my case it was app,
from app.models import setup_db
Verbally, import setup_db from models.py resides in the app folder.
If you are using pipenv then you need to specify the path to your virtual environment.in settings.json file.
For example :
{
"python.pythonPath":
"/Users/username/.local/share/virtualenvs/Your-Virual-Env/bin/python"
}
This can help.
If someone happens to be as moronic as me, the following worked.
Old folder structure:
awesome_code.py
__init__.py
src/
__init__.py
stuff1.py
stuff2.py
New structure:
awesome_code.py
src/
__init__.py
stuff1.py
stuff2.py
How to avoid warning
Please note that this is just skipping the warning not resolving it.
First of all open visual studio code settings in json and add following arguments after "[python]":{}
"python.linting.pylintArgs": ["--rep[![enter image description here][1]][1]orts", "12", "--disable", "I0011"],
"python.linting.flake8Args": ["--ignore=E24,W504", "--verbose"]
"python.linting.pydocstyleArgs": ["--ignore=D400", "--ignore=D4"]
This has helped me to avoid pylint warnings in VSCode.
I have resolved import error by Ctrl + Shift + P.
Type "Preferences settings" and select the option Preferences Open Settings (JSON)
And add the line "python.pythonPath": "/usr/bin/"
So the JSON content should look like:
{
"python.pythonPath": "/usr/bin/"
}
Keep other configuration lines if they are present.
This should import all modules that you have installed using PIP for autocomplete.

Import Polymer 2 components in Polymer 3

I am developing a web component using Polymer v3, and need to include some custom elements defined in legacy Polymer 2 components in the template HTML of my new component.
Since HTML imports are no longer supported in Polymer 3, what approach should I take to include them? If I was using Polymer 2 I could just add the following in my component's HTML file:
<link rel="import" href="../my-legacy-component.html">
I have tried adding the above link into the template HTML of my component, but it appears that doesn't work. I have also tried various import commands to reference the JS files inside the legacy component directly, but received various inscrutable JS errors so I'm not sure if that is the correct way to go either.
I can't believe there isn't a simple way to do this - would the Polymer team really introduce a new version of the library that is completely incompatible with all the components created using older versions?
Did you try to use polymer-modulizer?
Modulizer performs many different upgrade tasks, like:
Detects which .html files are used as HTML Imports and moves them to .js
Rewrites in HTML to import in JS.
Removes "module wrappers" - IIFEs that scopes your code.
Converts bower.json to package.json, using the corresponding packages on npm.
Converts "namespace references" to the proper JS module import, ie: Polymer.Async.timeOut to timeOut as imported from #polymer/polymer/lib/util/async.
Creates exports for values assigned to namespace referencs. ie, Foo.bar = {...} becomes export const bar = {...}
Rewrites namespace objects - an object with many members intended to be used as a module-like object, to JS modules.
Moves Polymer element templates from HTML into a JS template string.
Removes s if they only contained a template.
Moves other generic HTML in the document into a JS string and creates it when the module runs.
more on github
I have ran into the same problem with the module js-yaml earlier. I don't have enough reputation for a comment yet so I just write it down here.
Run this sudo npm install -g js-yaml -> This will install the missing package for the tool
Then at the root of your project, run modulizer --import-style name --out . -> This will convert your component from Polymer 2 to Polymer 3. The option --import-style name tells the tool to use package name instead of path. --out will make the tool writes those files to the directory.
After that, if no error prompts. Try to serve it with polymer serve --module-resolution=node -> Since we are using node modules now, we have to provide the --module-resolution=node option.

What is the purpose of tsconfig.json?

I was reading Angular2 references and found this: tsconfig.json.
I would like to know what the following parameters mean?
{
"compilerOptions": {
"target": "es5",
"module": "system",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": false
},
"exclude": [
"node_modules"
]
}
The tsconfig.json file corresponds to the configuration of the TypeScript compiler (tsc).
These links could give you details about these attributes:
http://www.typescriptlang.org/docs/handbook/tsconfig-json.html
http://json.schemastore.org/tsconfig
https://angular.io/docs/ts/latest/guide/typescript-configuration.html#!#tsconfig
Here are some hints:
target: the language used for the compiled output
module: the module manager used in the compiled output. system is for SystemJS, commonjs for CommonJS.
moduleResolution: the strategy used to resolve module declaration files (.d.ts files). With the node approach, they are loaded from the node_modules folder like a module (require('module-name'))
sourceMap: generate or not source map files to debug directly your application TypeScript files in the browser,
emitDecoratorMetadata: emit or not design-type metadata for decorated declarations in source,
experimentalDecorators: enables or not experimental support for ES7 decorators,
removeComments: remove comments or not
noImplicitAny: allow or not the use of variables / parameters without types (implicit)
tsconfig.json signifies the directory in which it is kept is the root of TypeScript project. The tsconfig.json file specifies the root files and the compiler options required to compile the project.
The compiler is expected to execute as per the configurations mentioned:
"target": "es5" => will compile the es6 to es5 so that it is compatible browsers.
"module": "system" => specifies the module code generations (commonjs', 'amd', 'system', 'umd', 'es6' etc)
"moduleResolution": "node" => Determine how modules get resolved
"sourceMap": true => Generates corresponding ‘.map’ file so that it can be used in the production code for debugging.
"removeComments": false => Remove all comments except copy-right header comments beginning with /*!
"noImplicitAny": false => Raise error on expressions and declarations with an implied ‘any’ type.
If the "exclude" property is specified, the compiler includes all TypeScript (*.ts or *.tsx) files in the containing directory and subdirectories except for those files or folders that are excluded.
Already there are lot of answers, but I would like to add one more point as why tsconfig required. As per angular docs
TypeScript is a primary language for Angular application development.
It is a superset of JavaScript with design-time support for type
safety and tooling.
Browsers can't execute TypeScript directly. Typescript must be
"transpiled" into JavaScript using the tsc compiler, which requires
some configuration.
Typically, you add a TypeScript configuration file called tsconfig.json to your project to guide the compiler as it generates JavaScript files.
For more information https://angular.io/guide/typescript-configuration
tsconfig file indicates the project as typescript project and it includes options on how the typescript files to be compiled. For details check the site https://www.typescriptlang.org/docs/handbook/tsconfig-json.html
Most of points are covered above. some are missed which i like to highlight.
tsconfig.json will tell where is build code and which version to target.
For instance, when it goes to production it will refer the below key in tsconfig.json and pick the build.
"outDir": "./dist/out-tsc", --> where to locate the build file.
And our browser do not understand typescript so mention which type of js to convert our code which will be understood by browser.
In other words, we write our code in typescript but bring that code to es5, We do that using the below field.
"target": "es2015",
As you know browsers can accept only javascript files, But when you use angular you don't use javascript. Instead you use typescript files .. so now we need a method to change those typescript files to js files.
It's done by tsconfig.json file that specifies the configuration options that we need to do this change . Such as compiler options and the root files .

ConfigurationBuilder Twitter4j class not found

Sorry, but it seems i cannot find any ConfigurationBuilder class in Twitter4j.
I'm using twitter4j version 3.0.3. I have already tried 3.0.2 android version too.
I have added the jar to build path like core, async, media, and stream.
I tried to :
- import twitter4j.*;
- import twitter4j.conf.*;
- import twitter4j.conf.ConfigurationBuilder;
But Eclipse says that :
Multiple markers at this line
- ConfigurationBuilder cannot be resolved to a
type
- ConfigurationBuilder cannot be resolved to a
type
What do i need?
I have already checked the source folders and there is a class named ConfigurationBuilder.java.
Thank you!
You have to make sure that Android Dependencies folder. To do that, you copy the twitter4j jar file to the libs folder and then right click to Configure Path and add the library.
After that's done, you will see that the library is also copied to the dependencies folder.
Right click on the project > Properties > Java Build Path > Libraries
Make sure that twitter4j-core-x.y.z.jar is really there
Go also to Order and Export tab in the same dialog
Make sure that the twitter4j-core-x.y.z.jar is selected (to get the jar distributed with the *.apk or else you will get something similar to the following at runtime: could not find class ConfigurationBuilder)
Project > Clean
Project > Build All