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. css3 让图片变成灰色(filter),但针对IE11浏览器无效2. 前端 - 集思广益,如何用CSS实现数字上面有一个点3. html5 - 前端面试碰到了一个缓存数据的问题,来论坛上请教一下4. macos - 无法source activate python275. 我在导入模板资源时遇到无法显示的问题,请老师解答下6. css - 移动端 盒子内加overflow-y:scroll后 字体会变大7. PHPExcel表格导入数据库怎么导入8. java - 同步/异步与阻塞/非阻塞之间的差异具体是什么?9. 运行python程序时出现“应用程序发生异常”的内存错误?10. java - butterknife怎么绑定多个view

网公网安备