1

我正在制作一个注入内容脚本的 chrome 扩展。我不希望 webpack 处理内容脚本。

我的目录结构:

/extension
|-manifest.json
|--scripts
   |- background.js
   |- content
      |-- script1.js
      |-- script2.js
      |-- ...

这是我调用 webpack 的 gulp 任务:

gulp.task('js', (cb) => {

  return gulp.src(['source/scripts/**/*.js'])
    .pipe(plumber({
      errorHandler: function(errors) {

      }
    }))
    .pipe(named())
    .pipe(gulpWebpack({
      watch: args.watch,
      module: {
        rules: [
          {
            enforce: "pre",
            test: /\.json$/,
            loader: "json-loader"
          },
          {
            enforce: "pre",
            test: /\.(gif|jpe?g|png)$/,
            loader: "file-loader?name=img/[name].[ext]",
          },
          {
            enforce: "pre",
            test: /content\//,
            loader: "file-loader?name=content/[name].[ext]",
          },
          {
            test: /\.js$/,
            loader: "babel-loader",
            exclude: [
              /content/
            ]
          }
        ],
      },
    }, null, (err, stats) => {
      log(`Finished '${colors.cyan('js')}'`, stats.toString({
        chunks: false,
        colors: true,
        cached: false,
        children: false
      }));
    }))
    .pipe(gulp.dest(`/scripts`))
});

我想将目录结构保留在构建目录中,而不是让里面的文件content/被解析,即。使用file-loader

但它们只是被解析,我pre的内容脚本规则被忽略了。

4

2 回答 2

0

Webpack 只会处理您正在编译的脚本所需的文件。这样做是不可能的,因为排除具有依赖关系的目录会破坏您的项目。

于 2017-11-09T11:58:28.317 回答
0

我做了一个单独的 gulp 任务来复制这些类型的脚本而不进行任何处理,并从调用 webpack 的 gulp 任务中排除了同一个目录

于 2017-11-11T10:13:02.920 回答