javascript - Webpack resolve.alias does not work with typescript?
問題描述
環境:
- 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', }))];
問題解答
回答1:應該是可以使用alias的,樓主可以參考我的react-typescript模版項目,https://github.com/devlee/tpl...
樓主這不能用,分析原因是tsconfig里的paths應該是路徑,而不是直接是源文件吧
回答2:解決了~ tool.js 必須要聲明一個要聲明一個對應的tool.d.ts文件。醉了醉了~~~
相關文章:
1. javascript - JS設置Video視頻對象的currentTime時出現了問題,IE,Edge,火狐,都可以設置,反而chrom卻...2. java固定鍵值轉換,使用枚舉實現字典?3. 如何為每個應用程序配置tomcat 6的logs / catalina.out。(為sys.out,sys.err配置Web應用程序特定的日志文件)4. css - ionic中的柵格布局如何讓文字內容多少不同的每一列中的內容都能垂直居中?5. php自學從哪里開始?6. phpstady在win10上運行7. java - 我設置了cookie的max age,但是cookie依然在關閉游覽器后消失了8. javascript - canvas設計鼠標畫圖功能一筆畫出多條并行彩色線條9. 這是什么情況???10. javascript - 微信網頁開發從菜單進入頁面后,按返回鍵沒有關閉瀏覽器而是刷新當前頁面,求解決?
