proper naming conventions
This commit is contained in:
parent
196d6254cb
commit
19528778a9
12
README.md
12
README.md
|
@ -10,21 +10,21 @@ yarn && yarn build
|
||||||
|
|
||||||
[Example](index.html)
|
[Example](index.html)
|
||||||
|
|
||||||
Basic: Link the dist file "mailymaily-min.js" at the bottom of your footer.
|
Basic: Link the dist file `mailymaily.min.js` at the bottom of your footer.
|
||||||
```html
|
```html
|
||||||
<script src="your/path/to/mailymaily-min.js"></script>
|
<script src="your/path/to/mailymaily.min.js"></script>
|
||||||
```
|
```
|
||||||
|
|
||||||
Alternatively: Add defer or async=false when linking in the header
|
Alternatively: Add defer or async=false when linking in the header
|
||||||
```html
|
```html
|
||||||
<script src="your/path/to/mailymaily-min.js" defer></script>
|
<script src="your/path/to/mailymaily.min.js" defer></script>
|
||||||
<!-- or -->
|
<!-- or -->
|
||||||
<script src="your/path/to/mailymaily-min.js" async=false></script>
|
<script src="your/path/to/mailymaily.min.js" async=false></script>
|
||||||
```
|
```
|
||||||
|
|
||||||
### VueJS & NuxtJs
|
### VueJS & NuxtJs
|
||||||
|
|
||||||
Place the dist file "mailymaily-min.js" in the static folder.
|
Place the dist file "mailymaily.min.js" in the static folder.
|
||||||
Link the dist file at the bottom of your layout, for example:
|
Link the dist file at the bottom of your layout, for example:
|
||||||
```html
|
```html
|
||||||
<template>
|
<template>
|
||||||
|
@ -32,7 +32,7 @@ Link the dist file at the bottom of your layout, for example:
|
||||||
<Header />
|
<Header />
|
||||||
<Nuxt />
|
<Nuxt />
|
||||||
<Footer />
|
<Footer />
|
||||||
<script src="/libs/mailymaily-min.js"></script>
|
<script src="/libs/mailymaily.min.js"></script>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
```
|
```
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
22
gulpfile.js
22
gulpfile.js
|
@ -1,4 +1,4 @@
|
||||||
const { src, dest, parallel, series, watch } = require('gulp');
|
const { src, dest, series } = require('gulp');
|
||||||
const autoprefixer = require('gulp-autoprefixer');
|
const autoprefixer = require('gulp-autoprefixer');
|
||||||
const minify = require('gulp-minify');
|
const minify = require('gulp-minify');
|
||||||
const cleanCSS = require('gulp-clean-css');
|
const cleanCSS = require('gulp-clean-css');
|
||||||
|
@ -10,9 +10,9 @@ const sass = require('gulp-sass');
|
||||||
const replace = require('gulp-replace');
|
const replace = require('gulp-replace');
|
||||||
//
|
//
|
||||||
function html() {
|
function html() {
|
||||||
return src('./src/html/component.html')
|
return src('./src/component.html')
|
||||||
.pipe(htmlMin({ collapseWhitespace: true }))
|
.pipe(htmlMin({ collapseWhitespace: true }))
|
||||||
.pipe(rename('./src/html/component-min.html'))
|
.pipe(rename('./src/component.min.html'))
|
||||||
.pipe(dest('./'));
|
.pipe(dest('./'));
|
||||||
}
|
}
|
||||||
function css() {
|
function css() {
|
||||||
|
@ -20,19 +20,19 @@ function css() {
|
||||||
.pipe(sass())
|
.pipe(sass())
|
||||||
.pipe(autoprefixer())
|
.pipe(autoprefixer())
|
||||||
.pipe(cleanCSS())
|
.pipe(cleanCSS())
|
||||||
.pipe(rename('./src/css/component-min.css'))
|
.pipe(rename('./src/css/component.min.css'))
|
||||||
.pipe(dest('./'));
|
.pipe(dest('./'));
|
||||||
}
|
}
|
||||||
function js() {
|
function js() {
|
||||||
const css = fs.readFileSync('./src/css/component-min.css');
|
const css = fs.readFileSync('./src/css/component.min.css');
|
||||||
const html = fs.readFileSync('./src/html/component-min.html');
|
const html = fs.readFileSync('./src/component.min.html');
|
||||||
return src('./src/js/mailymaily.js')
|
return src('./src/mailymaily.js')
|
||||||
.pipe(replace(/___css_inserter___/g, css))
|
.pipe(replace(/___css_inserter___/g, css))
|
||||||
.pipe(replace(/___html_inserter___/g, html))
|
.pipe(replace(/___html_inserter___/g, html))
|
||||||
.pipe(minify({ noSource: true }))
|
.pipe(minify({ noSource: true }))
|
||||||
|
.pipe(rename('mailymaily.min.js'))
|
||||||
.pipe(dest('./dist'));
|
.pipe(dest('./dist'));
|
||||||
}
|
}
|
||||||
function clean() {
|
const clean = () => del([ './src/component.min.html', './src/css/' ]);
|
||||||
return del([ './src/html/component-min.html', './src/css/' ]);
|
const prebuild = () => del([ './dist/' ]);
|
||||||
}
|
exports.default = series(prebuild, html, css, js, clean);
|
||||||
exports.default = series(html, css, js, clean);
|
|
||||||
|
|
|
@ -10,6 +10,6 @@
|
||||||
<body>
|
<body>
|
||||||
<h1>mailymaily-sample</h1>
|
<h1>mailymaily-sample</h1>
|
||||||
<a href="mailto:info@odit.services" target="_blank" rel="noopener noreferrer" class="mailymaily">info@odit.services</a>
|
<a href="mailto:info@odit.services" target="_blank" rel="noopener noreferrer" class="mailymaily">info@odit.services</a>
|
||||||
<script src="./dist/mailymaily-min.js"></script>
|
<script src="./dist/mailymaily.min.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
Loading…
Reference in New Issue