无法将tslint与webpack一起使用

Manu Chadha

尝试使用时出现以下错误tslint如果我删除tslint规则,那么一切正常

ERROR in ./test.ts
Module parse failed: C:\Users\Manu\Documents\manu\programs\typescript\test.ts Unexpected token (2:9)
You may need an appropriate loader to handle this file type.
| class Pizza {
|       toppings:string[];
|       constructor(toppings:string[]){
|               this.toppings = toppings;

我的webpack文件是

module.exports = {
    entry: './test.ts',
    output: {
        filename: './bundle.js'
    },
    module: {
        rules: [ //If I remove this rule, things work
            {
                test: /\.ts.$/, 
                enforce:"pre",
                loader:'tslint'
            }
        ],
        loaders: [ //If I keep only this, things work
            {
                test: /\.ts$/,
                exclude: /node_modules/,
                loader: 'ts-loader'
            },
        ],
    }
};

test.ts是

class Pizza {
    toppings:string[];
    constructor(toppings:string[]){
        this.toppings = toppings;
    }
}

package.json.lock

{
  "requires": true,
  "lockfileVersion": 1,
  "dependencies": {
    "ansi-styles": {
      "version": "3.2.0",
      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz",
      "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug==",
      "requires": {
        "color-convert": "1.9.1"
      }
    },
    "big.js": {
      "version": "3.2.0",
      "resolved": "https://registry.npmjs.org/big.js/-/big.js-3.2.0.tgz",
      "integrity": "sha512-+hN/Zh2D08Mx65pZ/4g5bsmNiZUuChDiQfTUQ7qJr4/kuopCr88xZsAXv6mBoZEsUI4OuGHlX59qE94K2mMW8Q=="
    },
    "chalk": {
      "version": "2.3.0",
      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.3.0.tgz",
      "integrity": "sha512-Az5zJR2CBujap2rqXGaJKaPHyJ0IrUimvYNX+ncCy8PJP4ltOGTrHUIo097ZaL2zMeKYpiCdqDvS6zdrTFok3Q==",
      "requires": {
        "ansi-styles": "3.2.0",
        "escape-string-regexp": "1.0.5",
        "supports-color": "4.5.0"
      }
    },
    "color-convert": {
      "version": "1.9.1",
      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.1.tgz",
      "integrity": "sha512-mjGanIiwQJskCC18rPR6OmrZ6fm2Lc7PeGFYwCmy5J34wC6F1PzdGL6xeMfmgicfYcNLGuVFA3WzXtIDCQSZxQ==",
      "requires": {
        "color-name": "1.1.3"
      }
    },
    "color-name": {
      "version": "1.1.3",
      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
    },
    "core-util-is": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
    },
    "emojis-list": {
      "version": "2.1.0",
      "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz",
      "integrity": "sha1-TapNnbAPmBmIDHn6RXrlsJof04k="
    },
    "enhanced-resolve": {
      "version": "3.4.1",
      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-3.4.1.tgz",
      "integrity": "sha1-BCHjOf1xQZs9oT0Smzl5BAIwR24=",
      "requires": {
        "graceful-fs": "4.1.11",
        "memory-fs": "0.4.1",
        "object-assign": "4.1.1",
        "tapable": "0.2.8"
      }
    },
    "errno": {
      "version": "0.1.4",
      "resolved": "https://registry.npmjs.org/errno/-/errno-0.1.4.tgz",
      "integrity": "sha1-uJbiOp5ei6M4cfyZar02NfyaHH0=",
      "requires": {
        "prr": "0.0.0"
      }
    },
    "escape-string-regexp": {
      "version": "1.0.5",
      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
    },
    "graceful-fs": {
      "version": "4.1.11",
      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.1.11.tgz",
      "integrity": "sha1-Dovf5NHduIVNZOBOp8AOKgJuVlg="
    },
    "has-flag": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz",
      "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE="
    },
    "inherits": {
      "version": "2.0.3",
      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
      "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
    },
    "isarray": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
      "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
    },
    "json5": {
      "version": "0.5.1",
      "resolved": "https://registry.npmjs.org/json5/-/json5-0.5.1.tgz",
      "integrity": "sha1-Hq3nrMASA0rYTiOWdn6tn6VJWCE="
    },
    "loader-utils": {
      "version": "1.1.0",
      "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.1.0.tgz",
      "integrity": "sha1-yYrvSIvM7aL/teLeZG1qdUQp9c0=",
      "requires": {
        "big.js": "3.2.0",
        "emojis-list": "2.1.0",
        "json5": "0.5.1"
      }
    },
    "memory-fs": {
      "version": "0.4.1",
      "resolved": "https://registry.npmjs.org/memory-fs/-/memory-fs-0.4.1.tgz",
      "integrity": "sha1-OpoguEYlI+RHz7x+i7gO1me/xVI=",
      "requires": {
        "errno": "0.1.4",
        "readable-stream": "2.3.3"
      }
    },
    "object-assign": {
      "version": "4.1.1",
      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
    },
    "process-nextick-args": {
      "version": "1.0.7",
      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz",
      "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M="
    },
    "prr": {
      "version": "0.0.0",
      "resolved": "https://registry.npmjs.org/prr/-/prr-0.0.0.tgz",
      "integrity": "sha1-GoS4WQgyVQFBGFPQCB7j+obikmo="
    },
    "readable-stream": {
      "version": "2.3.3",
      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz",
      "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ==",
      "requires": {
        "core-util-is": "1.0.2",
        "inherits": "2.0.3",
        "isarray": "1.0.0",
        "process-nextick-args": "1.0.7",
        "safe-buffer": "5.1.1",
        "string_decoder": "1.0.3",
        "util-deprecate": "1.0.2"
      }
    },
    "safe-buffer": {
      "version": "5.1.1",
      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.1.tgz",
      "integrity": "sha512-kKvNJn6Mm93gAczWVJg7wH+wGYWNrDHdWvpUmHyEsgCtIwwo3bqPtV4tR5tuPaUhTOo/kvhVwd8XwwOllGYkbg=="
    },
    "semver": {
      "version": "5.4.1",
      "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz",
      "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg=="
    },
    "string_decoder": {
      "version": "1.0.3",
      "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
      "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==",
      "requires": {
        "safe-buffer": "5.1.1"
      }
    },
    "supports-color": {
      "version": "4.5.0",
      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.5.0.tgz",
      "integrity": "sha1-vnoN5ITexcXN34s9WRJQRJEvY1s=",
      "requires": {
        "has-flag": "2.0.0"
      }
    },
    "tapable": {
      "version": "0.2.8",
      "resolved": "https://registry.npmjs.org/tapable/-/tapable-0.2.8.tgz",
      "integrity": "sha1-mTcqXJmb8t8WCvwNdL7U9HlIzSI="
    },
    "ts-loader": {
      "version": "3.2.0",
      "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-3.2.0.tgz",
      "integrity": "sha512-4g8BF3gKWBHeM1jAFmMPHofuJlwTUU4iHJ0i3mwXRHwy74RU6VBOgl9kDVMGpapvGcMlVqV5G6v9XmV66Qqd7w==",
      "requires": {
        "chalk": "2.3.0",
        "enhanced-resolve": "3.4.1",
        "loader-utils": "1.1.0",
        "semver": "5.4.1"
      }
    },
    "util-deprecate": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
    }
  }
}

webpack版本3.3.0 tslint 5.8.0

路易

主要的问题是,你正在使用module.rules,并module.loaders在同一时间。module.rules的优先级高于modules.loader,因此ts-loader永远不会转译我们的文件。您应该只使用module.rules另外,您需要修复linting的正则表达式test: /\.ts$/并且您需要使用loader作为tslint你不能只是问的WebPack到使用tslint 的,是作为一个加载器。我已经习惯了tslint-loader

我可以使用以下方法使Webpack处理您的代码:

module.exports = {
    entry: './test.ts',
    output: {
        filename: './bundle.js'
    },
    module: {
        rules: [
            {
                test: /\.ts$/,
                enforce:"pre",
                loader:'tslint-loader'
            },
            {
                test: /\.ts$/,
                exclude: /node_modules/,
                loader: 'ts-loader'
            },
        ],
    }
};

您需要提供适当的tsconfig.jsontslint.json文件。为了测试您的案件,我的tsconfig.jsonjust包含{}tslint.json从另一个我的项目中复制了一个,只是为了从中得到一些警告tslint-loader

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章