Nuxt.js 本地（CDN 远程）JS/CSS 全局（单页面）导入

一、JS/CSS CDN远程、本地导入细节

• 本地 JS/CSS，存放在 static 目录下，引用时，不需要添加 /static 目录，因为 /static 目录编译后会被映射到 / 目录

• JS 文件需要注意的是，如果文件中包含 ES6 的语法，例如 export 之类的导出，就不要通过配置文件去进行配置，会报错，而是直接通过在页面 import 进行导入即可。

• 测试代码（CDN远程、本地）

  

  

  

二、全局 JS/CSS CDN远程、本地导入

• nuxt.config.js 配置

  

  css 在 link 与 css 中导入无区别，选一种导入方式即可。

• 使用方式，直接使用即可

  

• 使用效果

  

二、单个页面 JS/CSS CDN远程、本地导入

• 配置使用

  export default {
    head () {
      return {
        link: [
          { rel: 'stylesheet', href: '/test.css' }
        ],
        script: [
          // 本地 JS，存放在 static 目录下，引用时，不需要添加 /static 目录，因为 /static 目录编译后会被映射到 / 目录
          { src: '/test.js' },
          // 远程 JS 导入
          { src: 'http://cdn.dengzemiao.cn/test.js' }
        ]
      }
    }
  }
  

  

• 效果跟全局一致。