Webpack 4, как загрузить другой файл, если его нет в том же каталоге - PullRequest
0 голосов
/ 03 марта 2019

Я хочу создать проект, который будет иметь родительскую / дочернюю структуру, и если какой-то файл не существует, он будет взят из ближайшего родительского элемента, у которого есть этот код, поэтому в случае примера структуры, если я создаю детей, он будет использовать init.tsот детей, file.ts от родителя и file2.ts от деда.Мне удалось сделать это с помощью модулей, поэтому, если я импортирую что-то из «файла», он сначала попытается найти его у потомков, потом у родителя и потом у дедушки, но вместо того, чтобы загружать это как модули, я хочу загрузить его через относительный путь, такой как импортчто-то из './file', и если его нет в этом пути, он должен загружаться из parent / granparent в webpack 1, это было возможно с помощью resol.roots, но я понятия не имею, как этого добиться в webpack 4

Здесьмоя структура проекта init.ts просто импортирует файл и файл2

Дедушка

  • init.ts
  • file.ts
  • file2.ts

Родитель

  • file.ts

Children

  • init.ts

index.ts

webpack.config.js

tsconfig.json

//index.ts
import 'init';

// webpack.config.js
const path = require('path');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
enter code here
module.exports = {
  entry: './index.ts',
  mode: 'production',
  resolveLoader: {
    modules: [
      'node_modules',
      path.resolve(__dirname, 'loaders')
    ]
  },
  plugins: [
    new MiniCssExtractPlugin({
      filename: '[name].css',
      chunkFilename: '[id].css',
    })
  ],
  module: {
    rules: [{
        test: /\.scss$/,
        use: [
          MiniCssExtractPlugin.loader,
          "css-loader",
          "sass-loader"
        ]
      },
      {
        test: /\.tsx?$/,
        use: 'ts-loader',
        exclude: /node_modules/
      }
    ]
  },
  resolve: {
    extensions: ['.tsx', '.ts', '.js'],
    modules: [
      // ta czesc będzie dynamiczna na podstawie configów :)
      path.resolve('./children'),
      path.resolve('./parent'),
      path.resolve('./grandparent'),
      path.resolve('./node_modules')
    ]
  },
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist')
  }
};

// tsconfig.json
{
  "compilerOptions": {
    "outDir": "./dist/",
    "noImplicitAny": true,
    "module": "es6",
    "target": "es5",
    "jsx": "react",
    "allowJs": true,
    "baseUrl": ".",
    "paths": {
      "*": [
        "children/*",
        "parent/*",
        "grandparent/*"
      ]
    }
  }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...