diff --git a/.eslintignore b/.eslintignore
index b4eaf65a..32947407 100644
--- a/.eslintignore
+++ b/.eslintignore
@@ -5,4 +5,4 @@ dist
coverage
# Plugin
-lib/plugin.js
+templates/plugin.js
diff --git a/docs/api/options.md b/docs/api/options.md
index a4d947d2..125550f9 100644
--- a/docs/api/options.md
+++ b/docs/api/options.md
@@ -6,6 +6,7 @@ General options of amp module
| Option | Default | Valid values | Description |
| ------ | ------- | ------------ | ----------- |
| cdnBase | `https://cdn.ampproject.org/v0/` | Any String | A CDN Domain to load AMP elements scripts |
+| css | `~/assets/style/amp-custom.css` | Path to CSS style | Custom styles for AMP pages |
| tags | `{}` | Object of tag options | Define new tags or modify current tags, for instance if you want to use `amp-mustache` version 0.1, tags value must be `{ 'amp-mustache': { version: '0.1' } }` |
| origin | `` | Any String | Main domain of website. Using this AMP modules tries to add missing canonical link for pages. |
| mode | `hybrid` | `only\|hybrid\|false` | Default behaviour of amp module. (`only` all pages serve in AMP mode by default, `hybrid` pages serves in both normal and AMP mode, `false` pages does not serve AMP by default ) |
diff --git a/example/assets/styles/amp-custom.scss b/example/assets/styles/amp-custom.scss
new file mode 100644
index 00000000..762cabc8
--- /dev/null
+++ b/example/assets/styles/amp-custom.scss
@@ -0,0 +1,5 @@
+$bg-color: #0cf;
+
+body {
+ background: $bg-color;
+}
\ No newline at end of file
diff --git a/example/assets/styles/default.amp.css b/example/assets/styles/default.amp.css
deleted file mode 100644
index 766aafce..00000000
--- a/example/assets/styles/default.amp.css
+++ /dev/null
@@ -1,3 +0,0 @@
-body {
- background: #0fc;
-}
\ No newline at end of file
diff --git a/example/assets/styles/default.css b/example/assets/styles/default.scss
similarity index 100%
rename from example/assets/styles/default.css
rename to example/assets/styles/default.scss
diff --git a/example/nuxt.config.js b/example/nuxt.config.js
index 818e0e38..f71fa6b3 100644
--- a/example/nuxt.config.js
+++ b/example/nuxt.config.js
@@ -7,9 +7,15 @@ module.exports = {
render: {
resourceHints: false
},
+ css: [
+ '~/assets/styles/default.scss'
+ ],
+ build: {
+ extractCSS: true
+ },
modules: [
- [ 'nuxt-i18n', {
- locales: [ 'en', 'fr' ],
+ ['nuxt-i18n', {
+ locales: ['en', 'fr'],
defaultLocale: 'en',
vueI18n: {
fallbackLocale: 'en',
@@ -22,10 +28,11 @@ module.exports = {
}
}
}
- } ],
+ }],
{ handler: require('../') }
],
amp: {
+ css: '~/assets/styles/amp-custom.scss',
origin: 'http://localhost:3000'
}
}
diff --git a/lib/module.js b/lib/module.js
index aa6ac0a8..aad8c3fa 100644
--- a/lib/module.js
+++ b/lib/module.js
@@ -1,10 +1,7 @@
-const { readdirSync } = require('fs')
const { resolve, join } = require('path')
-const consola = require('consola')
const chalk = require('chalk')
const { getTags, getNecessaryScripts } = require('./tags')
-
-const logger = consola.withScope('@nuxtjs/amp')
+const { logger } = require('./utils')
const AMPBoilerplate = '' +
''
@@ -13,8 +10,10 @@ const scriptPattern = /)<[^<]*)*<\/script>/gi
const ampBodyPattern = /]*>([.\S\s]*)<\/amp-body>/
module.exports = function (moduleOptions) {
+ const { nuxt } = this
const options = {
cdnBase: undefined,
+ css: undefined,
origin: '',
mode: 'hybrid',
tags: {},
@@ -25,15 +24,18 @@ module.exports = function (moduleOptions) {
}
registerPlugin.call(this, options)
- copyAMP.call(this, options)
registerRendererHook.call(this, options)
ensureMeta.call(this, options)
- if (options.validator && this.nuxt.options.dev) {
+ if (options.validator && nuxt.options.dev) {
registerValidator.call(this, options)
}
processRoutes.call(this, options)
+
+ // alias amp runtime
+ const runtimeDir = resolve(__dirname, './runtime')
+ nuxt.options.alias['~amp'] = runtimeDir
}
function processRoutes (options) {
@@ -142,9 +144,14 @@ function registerRendererHook (options) {
params.HEAD = params.HEAD
.replace(scriptPattern, v => (v.includes('custom-element') || v.includes('application/ld+json')) ? v : '')
- .replace(/<\/style>\S*