Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/439.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript TypeScript 2.9.1中私有变量的意外标记_Javascript_Typescript_Vue.js_Vue Cli - Fatal编程技术网

Javascript TypeScript 2.9.1中私有变量的意外标记

Javascript TypeScript 2.9.1中私有变量的意外标记,javascript,typescript,vue.js,vue-cli,Javascript,Typescript,Vue.js,Vue Cli,我目前正在使用VueJS和TypeScript 2.9.1。我正在创建一个库,稍后将其转换为typescript 使用vue cli构建库时,typescript linter会显示以下错误消息: 下午5:57:15,汇编了1条警告 错误:分析错误:意外标记 36 | 37 |导出默认类图{ >38 |私有_节点:GraphNodeList={} | ^ 39 |私有_边:EdgeList={} 40 | 41 |布局:布局|在src/Graph处未定义。ts:38:11:

我目前正在使用VueJS和TypeScript 2.9.1。我正在创建一个库,稍后将其转换为typescript

使用vue cli构建库时,typescript linter会显示以下错误消息:

下午5:57:15,汇编了1条警告 错误:分析错误:意外标记 36 | 37 |导出默认类图{ >38 |私有_节点:GraphNodeList={} | ^ 39 |私有_边:EdgeList={} 40 | 41 |布局:布局|在src/Graph处未定义。ts:38:11: 如果我删除“private”关键字,错误就会消失。但是我知道在typescript中允许使用private关键字。他们在文档中也这样写

有人知道为什么会这样吗?将来使用私有变量会很酷

tslint.json

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": true,
    "jsx": "preserve",
    "importHelpers": true,
    "moduleResolution": "node",
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "allowSyntheticDefaultImports": true,
    "sourceMap": true,
    "baseUrl": ".",
    "types": [
      "node",
      "jest"
    ],
    "paths": {
      "@/*": [
        "src/*"
      ]
    },
    "lib": [
      "es2017",
      "es2015",
      "dom",
      "dom.iterable",
      "scripthost"
    ]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx"
  ],
  "exclude": [
    "node_modules"
  ]
}
"variable-name": [true, "allow-leading-underscore"]
Package.json简化

{
  ...
  "scripts": {
    "build": "vue-cli-service build --target lib src/main.ts",
    "dev": "vue-cli-service build --mode development --name vue-flowy --watch --target lib src/main.ts",
  },
  "dependencies": {
    "d3": "^5.4.0",
    "dagre-d3-renderer": "^0.5.8",
    "graphlibrary": "^2.2.0",
    "vue-class-component": "^6.0.0",
    "vue-property-decorator": "^6.0.0"
  },
  "devDependencies": {
    "@types/debug": "^0.0.30",
    "@types/jest": "^22.0.1",
    "@vue/cli-plugin-e2e-cypress": "^3.0.0-beta.11",
    "@vue/cli-plugin-eslint": "^3.0.0-beta.11",
    "@vue/cli-plugin-typescript": "^3.0.0-beta.15",
    "@vue/cli-plugin-unit-jest": "^3.0.0-beta.11",
    "@vue/cli-service": "^3.0.0-beta.11",
    "@vue/eslint-config-prettier": "^3.0.0-beta.11",
    "@vue/eslint-config-typescript": "^3.0.0-beta.11",
    "@vue/test-utils": "^1.0.0-beta.16",
    "debug": "^3.1.0",
    "jest": "^22.4.3",
    "node-sass": "^4.9.0",
    "prettier-eslint-cli": "^4.7.1",
    "sass-loader": "^7.0.1",
    "ts-jest": "^22.4.6",
    "typescript": "^2.8.3",
    "vue": "^2.5.16",
    "vue-eslint-parser": "^2.0.3"
  },
  "module": "dist/vue-flowy.es.js",
  "repository": {
    "type": "git",
    "url": "git+https://github.com/Patcher56/vue-flowy.git"
  },
  "types": "types/index.d.ts",
  "files": [
    "dist",
    "src"
  ],
  "main": "dist/vue-flowy.umd.js",
  ...
  "peerDependencies": {
    "vue": "^2.5.16"
  },
  ...
}
vue.config.js

module.exports = {
  css: {
    extract: false
  }
}
build/index.ts

'use strict'
// Template version: 1.2.7
// see http://vuejs-templates.github.io/webpack for documentation.
const path = require('path')

module.exports = {
  dev: {
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {},
    host: 'localhost',
    port: 8080,
    autoOpenBrowser: true,
    errorOverlay: true,
    notifyOnErrors: true,
    poll: false,
    useEslint: true,
    showEslintErrorsInOverlay: true,
    devtool: '#source-map',
    cacheBusting: true,
    cssSourceMap: false
  },

  bundle: {
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    productionSourceMap: false,
    devtool: '#source-map',
    productionGzip: false,
    productionGzipExtensions: ['js', 'css'],
    bundleAnalyzerReport: process.env.npm_config_report
  },

  docs: {
    index: path.resolve(__dirname, '../docs/index.html'),
    assetsRoot: path.resolve(__dirname, '../docs'),
    assetsPublicPath: '',
    devtool: '#source-map',
    productionSourceMap: false
  }
}
链接到整个存储库:

您可以坚持规定私有变量不应该有前导下划线,或者,如果您坚持使用它,可以将其放在tslint.json中

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": true,
    "jsx": "preserve",
    "importHelpers": true,
    "moduleResolution": "node",
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "allowSyntheticDefaultImports": true,
    "sourceMap": true,
    "baseUrl": ".",
    "types": [
      "node",
      "jest"
    ],
    "paths": {
      "@/*": [
        "src/*"
      ]
    },
    "lib": [
      "es2017",
      "es2015",
      "dom",
      "dom.iterable",
      "scripthost"
    ]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx"
  ],
  "exclude": [
    "node_modules"
  ]
}
"variable-name": [true, "allow-leading-underscore"]
旁注:


我没有为typescript找到明确的vue样式指南,但在这里可以找到角度等价物:

您可以坚持约定,即私有变量不应该有前导下划线,或者,如果您坚持使用它,可以将其放在tslint.json中

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": true,
    "jsx": "preserve",
    "importHelpers": true,
    "moduleResolution": "node",
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "allowSyntheticDefaultImports": true,
    "sourceMap": true,
    "baseUrl": ".",
    "types": [
      "node",
      "jest"
    ],
    "paths": {
      "@/*": [
        "src/*"
      ]
    },
    "lib": [
      "es2017",
      "es2015",
      "dom",
      "dom.iterable",
      "scripthost"
    ]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx"
  ],
  "exclude": [
    "node_modules"
  ]
}
"variable-name": [true, "allow-leading-underscore"]
旁注:


我没有为typescript找到一个明确的vue样式指南,但在这里可以找到角度上的等价物:

我对代码进行了大量清理,删除了一些未使用的依赖项。 我还清理了我的tslint.json。问题现在解决了

我认为问题在于有太多的依赖项相互阻塞。
很抱歉,每个人都花了很多时间回答了这个问题。

我清理了很多代码,删除了一些未使用的依赖项。 我还清理了我的tslint.json。问题现在解决了

我认为问题在于有太多的依赖项相互阻塞。
很抱歉,每个人都花了这么多时间回答了这个问题。

出于好奇,如果您删除了?似乎是一个tslint东西,而不是一个编译器,会发生什么issue@T.J.Crowder是的,我也这么认为,但不幸的是,这并不能解决问题。请用a和你从中得到这个错误的工具的配置来更新这个问题使用该工具的名称-例如,你说的是typescript linter-你是指tslint?还是由tsc完成的内置Lint?或…?。@T.J.Crowder我向github添加了一个复制链接。它显示了项目的实际状态。是的,我使用的tslint是由vue cli@vue/typescriptOut出于好奇自动配置的,如果删除这个?看起来像一个tslint东西,而不是一个编译器issue@T.J.Crowder是的,我也这么认为,但不幸的是,这并不能解决问题。请用a和工具的配置更新问题,你从中得到了这个错误,还有工具的名称-例如,你说的是打字脚本linter-你是指tslint?还是内置linting done通过tsc?或…?。@T.J.Crowder,我向github添加了一个复制链接。它显示了项目的实际状态。是的,我使用的是由vue cli@vue/typescript自动配置的tslint。下划线不是问题。如果我将_节点更改为图形节点,则消息仍然显示。下划线不是问题。消息仍然显示如果我将_节点更改为图形节点。