2016-11-14 72 views
0

帮助感谢!为共享文件夹配置Webpack加载程序?

我的问题是如何让webpack将资源从共享文件夹编译到适当的内容脚本中?

我有一个使用react-redux-chrome的Chrome扩展。其文件结构是:

-build 
-content 
-event 
-popup 
package.json 
gulpfile.babel.js 
manifest.json 

吞气文件手表更改和编译相应的JavaScript,清单,和HTML文件到版本。

内容,事件和弹出窗口都有自己的webpack配置。

// content/webpack.config.js 
const path = require('path'); 

module.exports = { 

    entry: [ 
    './content/src/scripts/index.js' 
    ], 

    output: { 
    filename: 'content.js', 
    path: path.join(__dirname, '../', 'build'), 
    publicPath: '/' 
    }, 

    resolve: { 
    extensions: ['', '.js', '.jsx', '.scss', '.json'], 
    modulesDirectories: ['node_modules'], 
    }, 

    module: { 
    loaders: [ 
     { 
     test: /\.(jsx|js)?$/, 
     loader: 'babel', 
     exclude: /(node_modules)/, 
     include: path.join(__dirname, 'src'), 
     query: { 
      presets: ['es2015', 'react'] 
     } 
     }, 
     { test: /\.css$/, loader: "style-loader!css-loader" }, 
    ] 
    } 
}; 

我的分机有两个内容脚本,所以我的文件夹看起来就像这样......直到我试图从共享文件夹导入阵营模块

-build 
-content1 
-content2 
-shared 
-event 
-popup 
package.json 
gulpfile.babel.js 
manifest.json 

,一切工作正常。共享文件夹没有webpack配置。我收到错误:意外的令牌。你可能需要一个合适的加载器来处理这种文件类型。

如何获得的WebPack从共享文件夹编制资产注入适当的内容脚本?我尝试了一个别名,但它不起作用。

alias: { 
    shared: path.normalize('../../../../../../shared') 
} 

回答

0

我有一个大脑放屁...只需要为目录制作一个新的加载器。在content1/webpack.config.js和content2/webpack.config.js文件中...

{ 
    test: /\.(jsx|js)?$/, 
    loader: 'babel', 
    exclude: /(node_modules)/, 
    include: path.join(__dirname, '../shared'), 
    query: { 
     presets: ['es2015', 'react'] 
    } 
    },