Webpacker/Typescript 无法解析 rails 资产管道文件 [英] Webpacker/Typescript can't resolve rails asset pipeline file
问题描述
我正在尝试导入 rails 资产管道中的文件,但由于某种原因 webpack 找不到它.
I'm trying to import a file that is in the rails asset pipeline and for some reason webpack can't find it.
这是我的 tsconfig.json:
Here is my tsconfig.json:
{
"compilerOptions": {
"declaration": false,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": ["es6", "dom"],
"module": "es6",
"moduleResolution": "node",
"sourceMap": true,
"target": "es5",
"baseUrl": ".",
"paths": {
"@images/*": ["app/assets/images/*"],
}
},
"exclude": [
"**/*.spec.ts",
"node_modules",
"vendor",
"public"
],
"compileOnSave": false
}
这是我的 config/webpack/environment.js:
Here is my config/webpack/environment.js:
const { environment } = require('@rails/webpacker')
const customConfig = require('./custom');
const typescript = require('./loaders/typescript')
const fileLoader = require('./loaders/file');
environment.loaders.append('file', fileLoader)
environment.loaders.append('typescript', typescript)
// Merge custom config
environment.config.merge(customConfig);
module.exports = environment
我的配置/webpack/custom.js:
My config/webpack/custom.js:
const path = require('path');
module.exports = {
resolve: {
alias: {
'@src': path.resolve(__dirname, '..', '..', 'app/javascript'),
'@images': path.resolve(__dirname, '..', '..', 'app/assets/images'),
'@components': '@src/components',
React: 'react',
ReactDOM: 'react-dom'
}
}
};
import "@images/ajax-circle.gif";
在我的一个 typsecript 文件中给出错误 2307(无法解析模块)和 webpack-dev-server
无法编译,出现以下错误:
import "@images/ajax-circle.gif";
in one of my typsecript files gives error 2307 (can't resolve module) and webpack-dev-server
is unable to compile with the following error:
ERROR in /Users/brandoncc/dev/my_app/app/javascript/lib/store_management.ts
[tsl] ERROR in /Users/brandoncc/dev/my_app/app/javascript/lib/store_management.ts(1,24)
TS2307: Cannot find module '@images/ajax-circle.gif'.
webpack: Failed to compile.
错误似乎是因为打字稿无法解析文件,但我不知道为什么找不到它.
It looks like the error comes back to typescript not being able to resolve the file, but I can't figure out why it can't find it.
推荐答案
原来我需要为 .gif 扩展名添加一个定义.
It turns out that I needed to add a definition for the .gif extension.
创建typings.d.ts
:
declare module "*.gif";
修复它.
这篇关于Webpacker/Typescript 无法解析 rails 资产管道文件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!