newx
v0.2.2
Published
Reuse code as modules or components in static web pages and building readable codes.
Downloads
6
Readme
About
Reuse code as modules or components in static web pages and building readable codes.
Built with
Also refer to Poi.
Getting Started
Before we get started, ensure that you have installed Yarn (or npm) on your machine.
$ yarn add -D newx
Then create the files:
src/layout/base.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="app">
<block name="body"></block>
</div>
</body>
</html>
src/components/info.html
<div class="info">
<span>Newx.js</span>
</div>
src/pages/index.html
<extends src="../layouts/base.html">
<block name="body">
<import from="info.html"></import>
<p>Welcome~~</p>
</block>
</extends>
And just run the command to start a development server:
$ newx dev
√ Wrote index.html
✨ The development server runs on http://localhost:8080.
Visit the site and you will get:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="app">
<div class="info">
<span>Newx.js</span>
</div>
<p>Welcome~~</p>
</div>
</body>
</html>
Newx can also make static pages load vue components on demand.
Usage
Coming soon...
License
Distributed under the MIT License. See LICENSE
for more information.