2017-05-29 8 views
3

私はモジュールロードのために依然としてrequireJSを使用する既存のプロジェクト用の新しいモジュールを開発中です。私はwebpackのような私の新しいモジュールに新しいテクノロジーを使用しようとしています(これはes6のインポートを使ってes6ローダーを使用することができます)。 webpackはrequireJS構文との調整ができないようです。 「モジュールが見つかりません:エラー:解決できません」というようなことが表示されます。requirejs/AMDのWebpack

問題:WebpackはrequireJS/AMD構文のファイルをバンドルしません。
質問:webpackをrequireJSでうまく再生できる方法はありますか?

最終的な出力は、プロジェクトが正しくロードするためにはAMD形式でなければなりません。ありがとう。

+0

ウェブパック用のいくつかのバベルローダーを見ることができます。私は似たような問題を抱えていましたが、あなたは通常、バベルを使ってモジュールシステム間でトランスペアレントにすることができます –

+0

私のwebpack設定で既にbabelローダーを使用しています – goldensausage

答えて

4

私は同じ質問をしており、それを達成することができました。以下は同じwebpack.config.jsファイルです。

const fs = require('fs'); 
const path = require('path'); 
const webpack = require('webpack'); 

let basePath = path.join(__dirname, '/'); 

let config = { 
    // Entry, file to be bundled 
    entry: { 
    'main': basePath + '/src/main.js', 
    }, 
    devtool: 'source-map', 
    output: { 
    // Output directory 
    path: basePath + '/dist/', 
    library: '[name]', 
    // [hash:6] with add a SHA based on file changes if the env is build 
    filename: env === EnvEnum.BUILD ? '[name]-[hash:6].min.js' : '[name].min.js', 
    libraryTarget: 'amd', 
    umdNamedDefine: true 
    }, 
    module: { 
    rules: [{ 
     test: /(\.js)$/, 
     exclude: /(node_modules|bower_components)/, 
     use: { 
     // babel-loader to convert ES6 code to ES5 + amdCleaning requirejs code into simple JS code, taking care of modules to load as desired 
     loader: 'babel-loader', 
     options: { 
      presets: ['es2015'], 
      plugins: [] 
     } 
     } 
    }, { test: /jQuery/, loader: 'expose-loader?$' }, 
    { test: /application/, loader: 'expose-loader?application' }, 
    { test: /base64/, loader: 'exports-loader?Base64' } 
    ] 
    }, 
    resolve: { 
    alias: { 
     'jQuery': 'bower_components/jquery/dist/jquery.min', 
     'application': 'main', 
     'base64': 'vendor/base64' 
    }, 
    modules: [ 
     // Files path which will be referenced while bundling 
     'src/**/*.js', 
     'src/bower_components', 
     path.resolve('./src') 
    ], 
    extensions: ['.js'] // File types 
    }, 
    plugins: [ 

    ] 
}; 

module.exports = config;