Webpacker / Typescript не может разрешить файл конвейера ресурсов рельсов - PullRequest
Новая
       27

Webpacker / Typescript не может разрешить файл конвейера ресурсов рельсов

0 голосов
/ 26 февраля 2019

Я пытаюсь импортировать файл, который находится в конвейере ресурсов rails, и по какой-то причине веб-пакет не может его найти.

Вот мой 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: 

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

Мой 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"; в одном из моих файлов машинописного текста выдает ошибку2307 (не удается разрешить модуль) и webpack-dev-server не может скомпилировать со следующей ошибкой: 

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.

Похоже, ошибка возвращается к тому, что машинопись не может разрешить файл, но я могуне могу понять, почему он не может его найти.

Ответы [ 2 ]

0 голосов
/ 26 февраля 2019

Оказывается, мне нужно было добавить определение для расширения .gif.

Создание typings.d.ts с: 

declare module "*.gif";

исправило его.

0 голосов
/ 26 февраля 2019

Если вы используете функцию машинописного текста paths, вам нужно использовать tsconfig-paths-webpack-plugin, которая разрешит путь правильно.Просто добавьте это в конфигурацию вашего веб-пакета 

const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');

module.exports = {
  ...
  resolve: {
    plugins: [new TsconfigPathsPlugin({ /*configFile: "./path/to/tsconfig.json" */ })]
  }
  ...
}
...