javascript - Webpackresolve.alias 不適用於打字稿?
我想大声告诉你
我想大声告诉你 2017-07-05 10:36:58
0
2
1123

環境:

- node v6.9.2
- typescript v2.4.1
- webpack v1.15.0
- awesome-typescript-loader v3.2.1

問題:

在tsx中報錯 Module not found 'tools'...

import { toFieldValue } from '@utils/tools';

  • 在webpack的設定中加入resolve.alias

#
resolve : {
    alias: { 
        // 这里配置没有问题, jsx中可以正常使用
         "@utils": "./src/utils"
    }
}
  • jsx中引用(可以使用)

import { toFieldValue } from '@utils/tools'

tsx配置

{
  "compilerOptions": {
    "outDir": "./dist/",
    "module": "commonjs",
    "target": "es6",
    "sourceMap": true,
    "allowSyntheticDefaultImports": true,
    "jsx": "react",
    "pretty": true,
    "noImplicitAny": true,
    "traceResolution": true,
    "baseUrl": ".",
    "paths": {
      "@utils/*": ["./src/utils/*"]
    },
    "lib": [
      "dom",
      "es2015.promise",
      "es5",
      "es2015.iterable",
      "es2015.generator",
      "es2015.symbol",
      "es7"]
  },
  "include": [
    "./src/**/*"
  ],
  "exclude": [
    "node_modules"
  ],
  "awesomeTypescriptLoaderOptions": {
    "useBabel": true,
    "useCache": true
  }
}
  • webpack新增設定(webpackConfig是webpack的設定)

      webpackConfig.resolve.plugins = [(new TsConfigPathsPlugin({
        configFileName: "tsconfig.json",
        compiler: "typescript",
      }))];
    
我想大声告诉你
我想大声告诉你

全部回覆(2)
習慣沉默

應該是可以使用alias的,樓主可以參考我的react-typescript模版項目,https://github.com/devlee/tpl...

樓主這不能用,分析原因是tsconfig裡的paths應該是路徑,而不是直接是原始檔吧

过去多啦不再A梦

解決了~
tool.js 必須宣告一個要宣告一個對應的tool.d.ts檔。
醉了醉了~~~

熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板