如何将Webpack编译作为CircleCI配置的一部分运行

萨姆科科斯

我想将未编译的文件保存到Github,并让CircleCIwebpack稍后运行以对其进行编译。我似乎无法使它正常工作...

machine:
  node:
    version: 5.10.1

dependencies:
  override:
    - npm install
    - npm install webpack -g
    - webpack

test:
  override:
    - npm test

deployment:
  staging:
    branch: master
    heroku:
      appname: heroku-app-123

Webpack似乎已运行,因为我在CircleCI中得到以下输出:

哈希:db00c1

e4b7e0aa25c885
Version: webpack 1.12.14
Time: 10581ms
              Asset     Size  Chunks             Chunk Names
 /images/iphone.png  79.9 kB          [emitted]  
/images/macbook.png   117 kB          [emitted]  
   /images/temp.png  16.1 kB          [emitted]  
          bundle.js  2.38 MB       0  [emitted]  main
          style.css  19.9 kB       0  [emitted]  main
   [0] multi main 52 bytes {0} [built]
...

但是不幸的是,当部署它时,什么也没有呈现,这告诉我webpack实际上并没有运行。如果我在webpack本地运行命令并推送到Github,则一切正常,但是我不想依靠我记得在推送之前编译我的应用程序。

我的webpack编译步骤仅仅是放在错误的位置吗?我该如何解决?

我的webpack.config.js文件如下所示:

var path = require('path')
var webpack = require('webpack')
var ExtractTextPlugin = require('extract-text-webpack-plugin')
var autoprefixer = require('autoprefixer')

module.exports = {
  devtool: 'eval',
  entry: [
    'webpack-dev-server/client?http://localhost:3000',
    'webpack/hot/only-dev-server',
    './app/index'
  ],
  output: {
    path: path.join(__dirname, 'static'),
    filename: 'bundle.js',
    publicPath: ''
  },
  plugins: [
    new ExtractTextPlugin('style.css', {
      allChunks: true
    }),
    new webpack.HotModuleReplacementPlugin()
  ],
  module: {
    loaders: [
      {
        test: /\.js$/,
        loaders: ['babel'],
        exclude: /node_modules/,
        include: path.join(__dirname, 'app')
      },
      {
        test: /\.scss$/,
        loader: ExtractTextPlugin.extract('style', 'css?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss!sass')
      },
      {
        test: /\.(png|jpg)$/,
        loader: 'file?name=/images/[name].[ext]'
      }
    ]
  },
  resolve: {
    extensions: [ '', '.js', '.scss' ],
    modulesDirectories: [ 'app', 'node_modules' ]
  },
  postcss: [ autoprefixer({ browsers: ['last 2 versions'] }) ]
}
萨姆科科斯

答案是在部署期间运行webpack构建,如下所示:

...

deployment:
  aws:
    branch: master
    commands:
      - chmod +x deploy.sh
      - webpack --config webpack.prod.config.js
      - ./deploy.sh

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

作为WIX安装程序的一部分运行regsvr32

如何将GitHub Wiki作为源的一部分进行存储

如何将背景色仅作为选择的一部分?的CSS

不作为Travis CI的一部分运行“制造测试”吗?

确定PHP文件是否正在作为`phar`归档文件的一部分运行

仅当作为tfs msbuild进程的一部分运行时,nunit测试才会引发异常

如何将JSON作为多部分POST请求的一部分发送

作为Visual Studio Team Services构建任务的一部分运行“节点测试”,并在“测试”选项卡中显示结果

如何将Yocto构建模块fcntl作为Python构建的一部分

如何将特殊字符作为标题文本的一部分插入QMenu?

如何将一个UIViewController作为屏幕的一部分

如何在MS Access VBA中将附加查询作为事务的一部分运行

Angular-如何将应用程序的一部分作为辅助独立版本输出

如何将外部DAG作为我的DAG的一部分运行?

PyCharm作为类的一部分运行django单一测试

如何将函数调用的结果作为dplyr :: mutate的一部分展平?

如何将mysql_upgrade作为docker compose文件的一部分运行?

作为Django Web应用程序的MS Azure应用程序服务发布管道的一部分运行迁移

作为Azure Devops中的拉取请求分支策略的一部分运行顺序生成管道

作为全局扩展一部分运行的命令(即grep)如何知道?

如何将 TextureView 作为视图的一部分加载

作为 WSARecvFrom 调用的一部分,如何将缓冲区放入 CompletionROUTINE?

Dovecot Sieve - 如何将消息的一部分作为变量检索

在 Azure Pipelines 上将 Packer 作为构建不可变映像任务的一部分运行会返回 ResourceNotFound 错误

如何将特定表作为迁移的一部分 - Laravel 5?

查找未作为设置标签列表的一部分运行的测试

如果我使用 For 循环,如何将列表项作为结果的一部分包含在内?

作为函数的一部分,如何将小数转换为等效时间?

如何让任务作为 ECS 服务的一部分运行?