{time ? time.toLocaleString() : ''}
Inline all flagged js, css source files
npm install parcel-plugin-inline-source、 标签上添加 inline="inline" 属性,执行 parcel build 编译时会自动进行内联操作。
bash
$ npm install parcel-plugin-inline-source --save-dev
`
How it works
$3
`html
parcel-plugin-inline-source
`
`css
/ style.css /
header,
footer {
padding: 2em;
background: #16f;
color: #fff;
}
section {
padding: 2em;
background: #fff;
color: #16f;
}
`
`js
// index.js
import { render, Component } from 'preact';
class App extends Component {
constructor() {
super();
}
componentDidMount() {
setInterval(this.update.bind(this), 1000);
this.update();
}
update() {
this.setState({ time: new Date() });
}
render() {
let { time } = this.state;
return (
parcel-plugin-inline-source
{time ? time.toLocaleString() : ''}
);
}
}
render( , document.body);
`
$3
执行命令 parcel build index.html
> 只有在 parcel build 操作或者生产环境(NODE_ENV = 'production') 的情况下会自动进行内联操作
$3
`html
parcel-plugin-inline-source
``