私はnpmモジュール（https://www.npmjs.com/package/squarebook）を持っています、それはsrc /index.jsからdist / bundle.jsを生成するためにbabelローダーでwebpackを使用しています、そして私は私のpackage.jsonで指定しましたメインファイルがindex.js（メインディレクトリ）である場合、そのメインファイルのコードは次のとおりです。
module.exports = require('./dist/bundle');
これで、他のプロジェクトでnpm（npm install squarebook）を介してそのモジュールをインストールしました。このプロジェクトでは、次のようにbabelでgulpbrowserifyを使用しています。
import browserify from 'gulp-browserify';
import babelify from 'babelify';
gulp.task('build_js', function() {
return gulp.src('src/js/main.js')
.pipe(browserify({debug:true}))
.pipe(gulp.dest('dist/js/'));
});
この他のプロジェクトがsrc / js /main.jsに持っているものは次のとおりです。
import guestbook from 'squarebook';
squarebookパッケージからエクスポートされた関数としてguestbookを使用できることを期待していますが、これはprotoを含む空のオブジェクトです。
私は何が欠けているか、間違っているのですか？
@Matthiskの回答は機能しますが、module.exportsを使用せず、エクスポートのデフォルトを維持しない解決策は、次のようにパッケージwebpack構成ファイルでライブラリターゲット（libraryTarget： 'umd'）を指定することでした。
module.exports = {
entry: {
'bundle': './src/index.js',
},
output: {
path: path.resolve(__dirname, 'dist'),
filename: '[name].js',
libraryTarget: 'umd'
}
このようにして、ES6プロジェクトにモジュールをインポートすることができ、次の方法でES5モジュールからもインポートできます。
var squarebook = require('squarebook').default;
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加