好的,我應該更深入地瞭解webpack文檔。
tl; dr - 解決方案是resolve配置。
我的目錄結構是這樣的:
.
├── LICENSE.md
├── README.md
├── examples
│ ├── bundle.js
│ ├── index.html
│ ├── server.js
│ └── src
│ ├── components
│ │ ├── App.js
│ │ └── examples
│ │ └── ExampleOne.js
│ └── index.js
├── index.js
├── package-lock.json
├── package.json
├── src
│ └── index.js
├── test
├── webpack.config.js
└── webpack.examples.config.js
只是增加決心配置到我的webpack.config.examples.js沒有的伎倆。這裏是整個文件,僅供參考:
const webpack = require('webpack')
const path = require('path')
module.exports = {
entry: [
'react-hot-loader/patch',
'webpack-hot-middleware/client?path=/__webpack_hmr&timeout=20000',
'./examples/src/index.js',
],
output: {
path: path.resolve(__dirname, 'examples'),
publicPath: '/',
filename: 'bundle.js',
sourceMapFilename: 'bundle.js.map',
},
resolve: {
alias: {
'my-package': path.resolve(__dirname, 'src'),
},
},
devtool: 'eval-source-map',
plugins: [
new webpack.optimize.OccurrenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.NamedModulesPlugin(),
new webpack.NoEmitOnErrorsPlugin(),
],
module: {
rules: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
use: ['babel-loader'],
},
],
},
}
所以現在,當我的例子中的應用程序內的任何地方工作,我可以只使用:
import myThing from 'my-package'