handlebars

[dudulaopo833]

官网

handlebars : http://handlebarsjs.com/ or http://keenwon.com/992.html Tips: Handlebars 不仅仅处理html模板，任何文件都可以作为模板处理，比如js文件

传统方式：

• require the related package

• Usage

  <script id="template-id" type="text/x-handlebars-template>
  // Input template in here!
  

NPM方式：

• Install package

  npm install handlebars --save-dev
  npm install handlebars-loader --save-dev

• Usage

  import handlebars from 'handlebars';
  const template = fs.readFileSync('tempaltepath').toString();
  const returnFun = handlebars.compile(template);
  const content = returnFun(data);
  fs.writeFileSync(destPath, content); or use handlebars-loader to import

• Webpack setting: a. Webpack need to add loaders as below.
  webpackConfig.module.rules = [ { test: /.hbs$/, loader: 'handlebars-loader' }]; b. Webpack need to add below alias.
  webpackConfig.resolve = { modules: [], alias: { 'handlebars': 'handlebars/dist/handlebars.js' }};

  refer to how to fix require.extension

Tip: if make alias refer to runtime.js, after build it, it will encounter "Handlebars.compile is not a function" issue. So need to alias to dist/handlebars.js

Tip: if did not add this alias, it will show "WARNING in ./~/handlebars/lib/index.js require.extensions is not supported by webpack. Use a loader instead."