fix: #36 & #43

package.json

@@ -38,6 +38,7 @@
     "failFast": true,
     "files": [
       "packages/lavas-core-vue/test/unit/**/*.test.js",
+      "packages/lavas-core-vue/test/spec/**/*.js",
       "packages/lavas-core-vue/test/integration/*.js"
     ],
     "require": [

packages/lavas-core-vue/core/builder/dev-builder.js

@@ -8,14 +8,15 @@ import MFS from 'memory-fs';
 import chokidar from 'chokidar';
 import {readFileSync} from 'fs-extra';
 import {join, posix} from 'path';
+import {debounce} from 'lodash';
 
 import historyMiddleware from 'connect-history-api-fallback';
 import webpackDevMiddleware from 'webpack-dev-middleware';
 import webpackHotMiddleware from 'webpack-hot-middleware';
 import SkeletonWebpackPlugin from 'vue-skeleton-webpack-plugin';
 
 import {LAVAS_CONFIG_FILE, STORE_FILE, DEFAULT_ENTRY_NAME, DEFAULT_SKELETON_PATH} from '../constants';
-import {enableHotReload, writeFileInDev} from '../utils/webpack';
+import {enableHotReload, writeFileInDev, removeTemplatedPath} from '../utils/webpack';
 import {routes2Reg} from '../utils/router';
 import {isFromCDN} from '../utils/path';
 
@@ -48,6 +49,14 @@ export default class DevBuilder extends BaseBuilder {
         // in dev mode, ignore CDN publicPath and use default '/' instead.
         config.build.publicPath = isFromCDN(config.build.publicPath)
             ? '/' : config.build.publicPath;
+
+        /**
+         * in dev mode, remove templatedPath which contains [hash] [chunkhash] and [contenthash] in filenames
+         * https://github.com/webpack/webpack/issues/1914#issuecomment-174171709
+         */
+        Object.keys(config.build.filenames).forEach(key => {
+            config.build.filenames[key] = removeTemplatedPath(config.build.filenames[key]);
+        });
     }
 
     /**
@@ -113,9 +122,10 @@ export default class DevBuilder extends BaseBuilder {
 
         // use chokidar to rebuild routes
         let pagesDir = join(globals.rootDir, 'pages');
-        this.addWatcher(pagesDir, ['add', 'unlink'], async () => {
+        let rebuildRoutes = debounce(async () => {
             await this.routeManager.buildRoutes();
-        });
+        }, 200);
+        this.addWatcher(pagesDir, ['add', 'unlink'], rebuildRoutes);
 
         // watch files provides by user
         if (build.watch) {
@@ -139,7 +149,6 @@ export default class DevBuilder extends BaseBuilder {
         let clientCompiler; // compiler for client in ssr and spa
         let serverCompiler; // compiler for server in ssr
         let clientMFS;
-        // let noop = () => {};
         let ssrEnabled = this.config.build.ssr;
 
         await this.routeManager.buildRoutes();
@@ -202,7 +211,9 @@ export default class DevBuilder extends BaseBuilder {
         // prefix all the assets paths with publicPath in MFS
         this.devMiddleware = webpackDevMiddleware(clientCompiler, {
             publicPath: this.config.build.publicPath,
-            noInfo: true
+            noInfo: true,
+            stats: false,
+            logLevel: 'silent'
         });
 
         // set memory-fs used by devMiddleware
@@ -213,8 +224,8 @@ export default class DevBuilder extends BaseBuilder {
         }
 
         hotMiddleware = webpackHotMiddleware(clientCompiler, {
-            heartbeat: 5000,
-            // log: noop
+            heartbeat: 2500,
+            log: false
         });
         /**
          * TODO: hot reload for html

packages/lavas-core-vue/core/utils/webpack.js

@@ -93,3 +93,13 @@ export async function enableHotReload(dir, config, subscribeReload = false) {
         new webpack.NoEmitOnErrorsPlugin()
     );
 }
+
+/**
+ * remove templatedPath which contains [hash] [chunkhash] and [contenthash] in filenames
+ *
+ * @param {string} path original path
+ * @return {string} path path without templated path
+ */
+export function removeTemplatedPath(path) {
+    return path.replace(/\[(chunkhash|contenthash|hash)(:\d?)?\]\./g, '')
+}

packages/lavas-core-vue/test/integration/spa.js

@@ -15,12 +15,12 @@ let port = process.env.PORT || 3000;
 let core;
 let res;
 
-test.beforeEach('init lavas-core & server', async t => {
+test.before('init lavas-core & server', async t => {
     core = new LavasCore(join(__dirname, '../fixtures/simple'));
     app = createApp();
 });
 
-test.afterEach('clean', t => {
+test.after('clean', t => {
     server && server.close();
 });
 
@@ -44,32 +44,4 @@ test.serial('it should run in development mode correctly', async t => {
     t.is(200, res.status);
     // include skeleton
     t.true(res.text.indexOf(skeletonContent) > -1);
-
-    // serve /skeleton-index in dev mode
-    // res = await request(app)
-    //     .get('/skeleton-index');
-    // t.is(200, res.status);
-    // t.true(res.text.indexOf(skeletonContent) > -1);
-
-    // test nested route /parent/child1
-//     let childPageTitle = '<title data-vue-meta="true">Child1</title>';
-//     res = await request(app)
-//         .get('/parent/child1');
-//     t.is(200, res.status);
-//     t.true(res.text.indexOf(childPageTitle) > -1);
-//
-//     // serve static assets such as manifest.json
-//     res = await request(app)
-//         .get('/static/manifest.json');
-//     t.is(200, res.status);
-//     t.true(res.text.startsWith(`{
-//     "start_url": "/?utm_source=homescreen",
-// `));
-//
-//     // render error page for invalid route path
-//     let errorPageTitle = '<title data-vue-meta="true">服务器开小差了</title>';
-//     res = await request(app)
-//         .get('/invalid/path');
-//     t.is(200, res.status);
-//     t.true(res.text.indexOf(errorPageTitle) > -1);
 });

packages/lavas-core-vue/test/spec/remove-templated-path.js

@@ -0,0 +1,60 @@
+/**
+ * @file TestCase for #43
+ * @author panyuqi@baidu.com (panyuqi)
+ */
+
+import {join} from 'path';
+import test from 'ava';
+import LavasCore from '../../dist';
+
+import {syncConfig, isKoaSupport, request, createApp} from '../utils';
+
+let app;
+let server;
+let port = process.env.PORT || 3000;
+let core;
+let res;
+
+test.before('init lavas-core & server', async t => {
+    core = new LavasCore(join(__dirname, '../fixtures/simple'));
+    app = createApp();
+});
+
+test.after('clean', t => {
+    server && server.close();
+});
+
+test.serial('it should run in development mode correctly', async t => {
+    await core.init('development', true);
+
+    // switch to SPA mode
+    core.config.build.ssr = false;
+    syncConfig(core, core.config);
+
+    await core.build();
+
+    // set middlewares & start a server
+    app.use(isKoaSupport ? core.koaMiddleware() : core.expressMiddleware());
+    server = app.listen(port);
+
+    // serve index.html
+    let skeletonContent = `<div data-server-rendered=true class=skeleton-wrapper`
+    res = await request(app)
+        .get('/index.html');
+    t.is(200, res.status);
+    // include skeleton
+    t.true(res.text.indexOf(skeletonContent) > -1);
+
+    // generate filenames without [hash]
+    let clientMFS = core.builder.devMiddleware.fileSystem;
+    let jsDir = join(__dirname, '../fixtures/simple/dist/static/js');
+    let assets = [
+        'index.js',
+        'vue.js',
+        'vendor.js',
+        'manifest.js'
+    ];
+    assets.forEach(asset => {
+        t.truthy(clientMFS.readFileSync(join(jsDir, asset), 'utf8'));
+    });
+});