Question

我正在为客户修改购买的基于模板的主题。当我修改javascript文件时，bundle.js不会更新，我在CLI中看不到文件更改。我无法在本地网站上看到我的更改。但是，作为测试，我能够直接修改bundle.js并看到我的更改发生了。

我查看了BC文档，并在其他论坛中提问，但仍然没有解决方案。当我启动模板或运行bundle命令时，我在CLI中没有收到任何错误。我也可以毫无错误地将我的主题上传到商店。

有什么想法吗？

**编辑：

以下是我的stencil.conf.js文件的内容：

var path = require('path');
var webpack = require('webpack');
var webpackConfig = require('./webpack.conf.js');

webpackConfig.context = __dirname;
webpackConfig.entry = path.resolve(__dirname, 'assets/js/app.js');
webpackConfig.output = {
  path: path.resolve(__dirname, 'assets/js'),
  filename: 'bundle.js'
};

/**
 * Watch options for the core watcher
 * @type {{files: string[], ignored: string[]}}
 */
var watchOptions = {
  // If files in these directories change, reload the page.
  files: [
    '/assets',
    '/templates',
    '/lang'
  ],

  //Do not watch files in these directories
  ignored: [
    '/assets/scss',
    '/assets/css',
  ]
};

/**
 * Hook into the stencil-cli browsersync instance for rapid development of themes.
 * Watch any custom files and trigger a rebuild
 * @param {Object} Bs
 */
function development(Bs) {
  var compiler = webpack(webpackConfig);
  // Rebuild the bundle once at bootup
  compiler.watch({}, function(err, stats) {
    if (err) {
      console.error(err)
    }

    Bs.reload();
  });
}

/**
 */
/**
 * Hook into the `stencil bundle` command and build your files before they are packaged as a .zip
 * Be sure to call the `done()` callback when finished
 * @param {function} done
 */
function production(done) {
  var compiler;

  webpackConfig.devtool = false;
  webpackConfig.plugins.push(new webpack.optimize.DedupePlugin());
  webpackConfig.plugins.push(new webpack.optimize.UglifyJsPlugin({
    comments: false
  }));

  compiler = webpack(webpackConfig);

  compiler.run(function(err, stats) {
    if (err) {
      throw err;
    }

    done();
  });
}

module.exports = {
  watchOptions: watchOptions,
  development: development,
  production: production,
};

以下是我的webpack.conf.js文件的内容：

    var path = require('path');
    var webpack = require('webpack');

    module.exports = {
        devtool: 'eval-cheap-module-source-map',
        bail: false,
        module: {
            loaders: [
                {
                    test: /\.js$/,
                    loader: 'babel',
                    include: [
                        path.resolve(__dirname, 'assets/js'),
                        path.resolve(__dirname, 'node_modules/@bigcommerce/stencil-utils'),
                    ],
                    query: {
                        compact: false,
                        cacheDirectory: true,
                        presets: [ ['es2015', {loose: true}] ]
                    }
                 }
            ]
        },
        plugins: [],
        watch: false
    };

本地JavaScript文件未更新 - 模板CLI

0 个答案: