WebPack 1.x-从外部Webpack根目录使用文件

时间:2020-01-21 12:23:44

标签: javascript reactjs webpack

我有这个项目架构:

Root
    Project1
        package.json
        webpack.config
    Project2
        package.json
        webpack.config
    Common
        file1.js

我希望每个项目都可以使用file1.js

我正在使用旧的webpack 1.13.1

我尝试使用别名:

resolve: {
    alias: {
      commons: path.resolve(__dirname, ".../../Common/")
    }
}

我尝试了两种方式:

import ProcessTree from '../../Common/file1';
import ProcessTree from 'commons/file1';

有什么想法吗?

这是我的webpack配置:

import webpack from 'webpack';
import path from 'path';

let commonPath= path.resolve(__dirname, '..', '..', 'Common');

export default {
  devtool: 'eval-source-map',
  entry: [
    './src/index'
  ],
  target: 'web',
  output: {
    path: __dirname + '/dist', // Note: Physical files are only output by the production build task `npm run build`.
    publicPath: '/',
    filename: 'bundle.js'
  },
  resolve: {
    alias: {
      commons: commonPath
    }
  },
  devServer: {
    contentBase: './src'
  },
  module: {
    loaders: [
      { 
        test: /\.js$/, 
        include: [
          path.join(__dirname, 'src'), 
          commonPath
        ],
        loaders: ['babel'] 
      },
      { test: /(\.css)$/, loaders: ['style', 'css?sourceMap'] },
      { test: /(\.scss)$/, loaders: ['style', 'css?sourceMap', 'sass?sourceMap'] },
      { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: 'file' },
      { test: /\.(woff|woff2)$/, loader: 'url?prefix=font/&limit=5000' },
      { test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=application/octet-stream' },
      { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?mimetype=image/svg+xml' }
    ]
  },
  node: {
    fs: "empty",
    child_process: 'empty',
  }
};

1 个答案:

答案 0 :(得分:0)

确保要使用Common文件夹处理文件的模块装入程序规则中均包含该路径。

例如:

module: {
  loaders: [
    {
      test: /\.js?$/,
      include: [
        path.resolve(__dirname),
        path.resolve(__dirname, "../../Common")
      ],
      exclude: /node_modules/,
      loader: "babel-loader"
    }
  ]
}
相关问题