環境:
- 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'
{
"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",
}))];
習慣沉默2017-07-05 10:38:58
應該是可以使用alias的,樓主可以參考我的react-typescript模版項目,https://github.com/devlee/tpl...
樓主這不能用,分析原因是tsconfig裡的paths應該是路徑,而不是直接是原始檔吧