ESLint 'module' is not defined. (no-undef) into PhpStorm - phpstorm

In PhpStorm I have this error in my .eslintrc file :
ESLint 'module' is not defined. (no-undef) into PHPStorm
I already try to fix it using this StackOverflow question. But the result is the same. ESLint error appears again.
This is my .eslintrc file:
/* eslint-env node */
{
"root": false,
"parser": "#typescript-eslint/parser",
"plugins": [
"#typescript-eslint"
],
"env": {
"node": true,
"browser": true,
"commonjs": true,
"es6": true,
"amd": true
},
"extends": [
"eslint:recommended",
"plugin:vue/base",
"plugin:vue/essential",
"plugin:vue/vue3-recommended",
"plugin:vue/vue3-essential",
"#vue/typescript/recommended",
"plugin:#typescript-eslint/eslint-recommended",
"plugin:#typescript-eslint/recommended"
],
"parserOptions": {
"ecmaVersion": 2020
},
"rules": {
"no-console": "error",
"no-debugger": "error",
"no-unused-components": "off",
"no-unused-vars": "off",
"no-empty-function": "off",
"prefer-const": "off",
"#typescript-eslint/no-unused-vars": "off"
},
"overrides": [
{
"files": [
"**/__tests__/*.{j,t}s?(x)",
"**/tests/unit/**/*.spec.{j,t}s?(x)"
],
"env": {
"mocha": true
}
}
]
}
Perhaps it's a PhpStorm issue ?
How to resolve this error ESLint ?

delete 'es6': 'true',
just like:
"env": {
"node": true,
"browser": true,
"commonjs": true,
"amd": true
}

Related

Override global eslint config rules in subdirectory

I'm migrating from tslint to eslint. However I'm unable to apply the rules in a similar way. A .eslintrc.json in a subdirectory is just ignored. But I need to override some rules for some subdirectories. In this case, the selector prefix should be ui instead app for all files in this subdirectory.
Root .eslintrc.json
{
"root": true,
"ignorePatterns": ["projects/**/*"],
"overrides": [
{
"files": ["*.ts"],
"parserOptions": {
"project": ["tsconfig.json"],
"createDefaultProgram": true
},
"extends": ["plugin:#angular-eslint/recommended", "plugin:#angular-eslint/template/process-inline-templates"],
"rules": {
"#angular-eslint/directive-selector": [
"error",
{
"type": "attribute",
"prefix": "app",
"style": "camelCase"
}
],
"#angular-eslint/component-selector": [
"error",
{
"type": "element",
"prefix": "app",
"style": "kebab-case"
}
]
}
},
{
"files": ["*.html"],
"extends": ["plugin:#angular-eslint/template/recommended"],
"rules": {}
}
]
}
src/elements/.eslintrc.json
{
"overrides": [
{
"files": ["*.ts"],
"rules": {
"#angular-eslint/directive-selector": [
"error",
{
"type": "attribute",
"prefix": "ui",
"style": "camelCase"
}
],
"#angular-eslint/component-selector": [
"error",
{
"type": "element",
"prefix": "ui",
"style": "kebab-case"
}
]
}
}
]
}
Turned out I had to add the tsconfig.json path in parserOptions. So the overriding file looks like this:
{
"overrides": [
{
"files": ["*.ts"],
"parserOptions": {
"project": ["../../../tsconfig.json"],
"createDefaultProgram": true
},
"rules": {
"#angular-eslint/directive-selector": [
"error",
{
"type": "attribute",
"prefix": "ui",
"style": "camelCase"
}
],
"#angular-eslint/component-selector": [
"error",
{
"type": "element",
"prefix": "ui",
"style": "kebab-case"
}
]
}
}
]
}

Problems setting up debugging in Visual Studio code for Chrome, have it working for Firefox

I have the following in .vscode/launch.json :
{
"version": "0.2.0",
"configurations": [
{
"type": "firefox",
"request": "launch",
"reAttach": true,
"name": "vuejs: firefox",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}/src",
"firefoxExecutable": "C:/Users/Geoffrey Swenson/AppData/Local/Mozilla Firefox/firefox.exe",
"breakOnLoad": true,
"sourceMapPathOverrides": {
"webpack:/*": "${webRoot}/*",
"/./*": "${webRoot}/*",
"/src/*": "${webRoot}/*",
"/*": "*",
"/./~/*": "${webRoot}/node_modules/*"
},
"preLaunchTask": "serve"
},
{
"type": "chrome",
"request": "launch",
"reAttach": true,
"name": "vuejs: chrome",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}/src",
"breakOnLoad": true,
"sourceMapPathOverrides": {
"webpack:/*": "${webRoot}/*",
"/./*": "${webRoot}/*",
"/src/*": "${webRoot}/*",
"/*": "*",
"/./~/*": "${webRoot}/node_modules/*"
},
"preLaunchTask": "serve"
}]
}
I have the following in .vscode/tasks.json :
{
"version": "2.0.0",
"tasks": [
{
"label": "start",
"type": "npm",
"script": "serve",
"isBackground": true
},
{
"label": "serve",
"type": "npm",
"script": "serve",
"isBackground": true,
"problemMatcher": [{
"base": "$tsc-watch",
"background": {
"activeOnStart": true,
"beginsPattern": "Starting development server",
"endsPattern": "Compiled successfully"
}
}],
"group": {
"kind": "build",
"isDefault": true
}
}
]
}
I also have vue.config.ts :
module.exports = {
configureWebpack: {
devtool: 'source-map'
}
}
Breakpoints work in Firefox, though I have to press F5 the first time I load it. They never work in Chrome. Firefox involves installing a debugger extension, but there is supposedly no need for this for Chrome.
first you need to set launch.json and then set your config file as you need:
hereafter an example which works with vite running as bundler in front and server in back
{
"debug": {
"javascript": {
"terminalOptions": {
"skipFiles": [
"<node_internals>/**"
],
"trace": true
}
}
},
"configurations": [
{
"name": "Run bundler",
"request": "launch",
"type": "node-terminal",
"command": "npm run <your-command-to-run-app>",
"cwd": "${workspaceFolder}"
}
]
}
Then forget webpack and use vite, thus you need to install vite and a vite config file
import { defineConfig } from 'vite';
import vue from '#vitejs/plugin-vue';
// cf. https://vitejs.dev/config/
export default defineConfig(async ({ command, mode }) => {
return {
plugins: [vue()],
server: {
proxy: {
'/api/': {
target: 'http://localhost:3080',
changeOrigin: true,
secure: false
}
},
port: 3080,
strictPort: true
},
build: {
outDir: './server/public'
}
};
});
I use typescript and in my ts.config.json, I setted
...
"sourceMap": true,
"types": ["vite/server"],
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true
...
hope that's will help folk's !

End of file expected.json line 21 [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 1 year ago.
Improve this question
Can someone correct my JSON code and tell me what I did wrong? When I try to use it, I get an error on line 21, and I don't know what to do.
This is my code:
{
"terminal.integrated.shell.windows": "C:\\Windows\\System32\\cmd.exe",
"code-runner.runInTerminal": true,
"explorer.confirmDelete": false,
"editor.linkedEditing": true,
"liveServer.settings.donotVerifyTags": true,
"liveServer.settings.donotShowInfoMsg": true,
"files.autoSaveDelay": 1,
"files.autoSave": "afterDelay",
"liveServer.settings.CustomBrowser": "firefox",
"tabnine.experimentalAutoImports": true,
"workbench.iconTheme": "easy-icons",
"workbench.colorTheme": "Field Lights",
"workbench.editorAssociations": [
{
"viewType": "jupyter.notebook.ipynb",
"filenamePattern": "*.ipynb"
}
],
"[html]": {
"editor.defaultFormatter": "vscode.html-language-features"
}
}
{
"actionButtons": {
"defaultColor": "white",
"reloadButton": "Reload",
"commands": [
{
"name" : "Build",
"color": "white",
"command": "idf.py build"
},
{
"name" : "Run",
"color": "white",
"command": "idf.py flash -p COM1 -b 921600 monitor"
}
]
},
}
Thank you in advance!
You have a comma at the second last bracket.
It seems like you have 2 JSON objects as parents in the same file. I'm pretty sure that a JSON file only can have one parent/root that is either an object or an array.
This means that you will need to have two files instead of one.
One containing the first JSON object:
{
"terminal.integrated.shell.windows": "C:\\Windows\\System32\\cmd.exe",
"code-runner.runInTerminal": true,
"explorer.confirmDelete": false,
"editor.linkedEditing": true,
"liveServer.settings.donotVerifyTags": true,
"liveServer.settings.donotShowInfoMsg": true,
"files.autoSaveDelay": 1,
"files.autoSave": "afterDelay",
"liveServer.settings.CustomBrowser": "firefox",
"tabnine.experimentalAutoImports": true,
"workbench.iconTheme": "easy-icons",
"workbench.colorTheme": "Field Lights",
"workbench.editorAssociations": [
{
"viewType": "jupyter.notebook.ipynb",
"filenamePattern": "*.ipynb"
}
],
"[html]": {
"editor.defaultFormatter": "vscode.html-language-features"
}
}
And another containing the second JSON object:
{
"actionButtons": {
"defaultColor": "white",
"reloadButton": "Reload",
"commands": [
{
"name" : "Build",
"color": "white",
"command": "idf.py build"
},
{
"name" : "Run",
"color": "white",
"command": "idf.py flash -p COM1 -b 921600 monitor"
}
]
}
}
You could also have it in the same file, but wrapped in another root/parent object, like this:
{
"object1": {
"terminal.integrated.shell.windows": "C:\\Windows\\System32\\cmd.exe",
"code-runner.runInTerminal": true,
"explorer.confirmDelete": false,
"editor.linkedEditing": true,
"liveServer.settings.donotVerifyTags": true,
"liveServer.settings.donotShowInfoMsg": true,
"files.autoSaveDelay": 1,
"files.autoSave": "afterDelay",
"liveServer.settings.CustomBrowser": "firefox",
"tabnine.experimentalAutoImports": true,
"workbench.iconTheme": "easy-icons",
"workbench.colorTheme": "Field Lights",
"workbench.editorAssociations": [
{
"viewType": "jupyter.notebook.ipynb",
"filenamePattern": "*.ipynb"
}
],
"[html]": {
"editor.defaultFormatter": "vscode.html-language-features"
}
},
"object2": {
"actionButtons": {
"defaultColor": "white",
"reloadButton": "Reload",
"commands": [
{
"name" : "Build",
"color": "white",
"command": "idf.py build"
},
{
"name" : "Run",
"color": "white",
"command": "idf.py flash -p COM1 -b 921600 monitor"
}
]
}
}
}
Or do it as an array, like this:
[
{
"terminal.integrated.shell.windows": "C:\\Windows\\System32\\cmd.exe",
"code-runner.runInTerminal": true,
"explorer.confirmDelete": false,
"editor.linkedEditing": true,
"liveServer.settings.donotVerifyTags": true,
"liveServer.settings.donotShowInfoMsg": true,
"files.autoSaveDelay": 1,
"files.autoSave": "afterDelay",
"liveServer.settings.CustomBrowser": "firefox",
"tabnine.experimentalAutoImports": true,
"workbench.iconTheme": "easy-icons",
"workbench.colorTheme": "Field Lights",
"workbench.editorAssociations": [
{
"viewType": "jupyter.notebook.ipynb",
"filenamePattern": "*.ipynb"
}
],
"[html]": {
"editor.defaultFormatter": "vscode.html-language-features"
}
},
{
"actionButtons": {
"defaultColor": "white",
"reloadButton": "Reload",
"commands": [
{
"name" : "Build",
"color": "white",
"command": "idf.py build"
},
{
"name" : "Run",
"color": "white",
"command": "idf.py flash -p COM1 -b 921600 monitor"
}
]
}
}
]

Angular-cli SyntaxError: Unexpected token ]

I just pulled the new version of my project with git and angular-cli stopped working. When I start it, I get the following error:
Parsing .angular-cli.json failed. Please make sure your .angular-cli.json is valid JSON. Error:
SyntaxError: Unexpected token ] in JSON at position 1044
InvalidConfigError: Parsing .angular-cli.json failed. Please make sure your .angular-cli.json is valid JSON. Error:
SyntaxError: Unexpected token ] in JSON at position 1044
My angular-cli.json file is the following:
{
"project": {
"version": "1.0.0-beta.22-1",
"name": "quest"
},
"apps": [
{
"root": "src",
"outDir": "dist",
"assets": [
"assets"
],
"index": "index.html",
"main": "main.ts",
"test": "test.ts",
"tsconfig": "tsconfig.json",
"prefix": "app",
"mobile": false,
"styles": [
"styles.less",
"../node_modules/angular2-toaster/toaster.css",
"../node_modules/bootstrap-slider/dist/css/bootstrap-slider.min.css",
"../node_modules/bootstrap-timepicker/css/bootstrap-timepicker.css",
"../node_modules/bootstrap-datepicker/dist/css/bootstrap-datepicker.css"
],
"scripts": [
"../node_modules/jquery/dist/jquery.js",
"../node_modules/bootstrap/dist/js/bootstrap.js",
"../node_modules/admin-lte/dist/js/app.js",
"../node_modules/bootstrap-slider/dist/bootstrap-slider.js",
"../node_modules/bootstrap-timepicker/js/bootstrap-timepicker.min.js",
"../node_modules/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js"
],
"environmentSource": "environments/environment.ts",
"environments": {
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts"
}
}
],
"addons": [],
"packages": [],
"e2e": {
"protractor": {
"config": "./protractor.conf.js"
}
},
"test": {
"karma": {
"config": "./karma.conf.js"
}
},
"defaults": {
"styleExt": "css",
"prefixInterfaces": false,
"inline": {
"style": false,
"template": false
},
"spec": {
"class": false,
"component": true,
"directive": true,
"module": false,
"pipe": true,
"service": true
}
}
}
I tried updating angular-cli, I tried deleting node_modules et running npm install. I have node version 6.9.5. I tried parsing the angular-cli.json with some JSON validation tools.
Any other idea?

ExtJS4 How to set TreePanels root node from JSON

I want to create TreePanel using ExtJS4. So I'm sending JSON to proxy reader which has following format
{
"text": "en",
"children": {
"text": "/",
"children": [{
"text": "/page",
"children": [{
"text": "/page/new",
"children": [],
"leaf": true,
"expanded": false
},
{
"text": "/page/remove",
"children": [],
"leaf": true,
"expanded": false
}
],
"leaf": false,
"expanded": false
},
{
"text": "/home",
"children": [],
"leaf": true,
"expanded": false
}
],
"leaf": false,
"expanded": true
}
}
How do I have to configure my Store if I want en node to be my root node.
Ext.define('Example.store.WebItems', {
extend: 'Ext.data.TreeStore',
model: 'Example.model.Item',
proxy: {
type: 'ajax',
api: {
read: 'some/url',
},
reader: {
type: 'json',
root: 'children' // Is this correct?
}
},
root: // What should I write here?
});
When I define TreeStore's root as root: 'My Root' it will add new root, but I want to use root defined in JSON.
So my questions are:
How to use root node from JSON instead of defining it manualy?
Do I have to define root node in proxy reader and TreeStore as well?
Response has to have root.
For example:
{
MyRoot: {
"text": "en",
"children": {
"text": "/",
"children": [{
"text": "/page",
"children": [{
"text": "/page/new",
"children": [],
"leaf": true,
"expanded": false
}, {
"text": "/page/remove",
"children": [],
"leaf": true,
"expanded": false
}],
"leaf": false,
"expanded": false
}, {
"text": "/home",
"children": [],
"leaf": true,
"expanded": false
}],
"leaf": false,
"expanded": true
}
}
}
In this example root is MyRoot. Now you have to "tell" reader that your root is MyRoot:
// ...
reader: {
type: 'json',
root: 'MyRoot'
}
},
//root: this config is not needed now
});
As per I know, you need to specify root as following:
root: {
text: 'en',
id: 'src',
expanded: true '
}
Try the above code snippet it will help you.
May be late but for others , wrap the JSON inside array [] just like this :
[{
"text": "en",
"children": {
"text": "/",
"children": [{
"text": "/page",
"children": [{
"text": "/page/new",
"children": [],
"leaf": true,
"expanded": false
}, {
"text": "/page/remove",
"children": [],
"leaf": true,
"expanded": false
}],
"leaf": false,
"expanded": false
}, {
"text": "/home",
"children": [],
"leaf": true,
"expanded": false
}],
"leaf": false,
"expanded": true
}
}]
Remove the reader block
reader: {
type: 'json',
root: 'MyRoot'
}
Add root block :
root: {
text: 'en',
id: 'src',
expanded: true '
}
Add rootVisible: false in treepanel.