js javascript 引入文件 处理文件 js json excel pdf svg svga

1、es6的export import ，引入

2、json文件的引入

const PSD = require('psd.js')

const psdNameMap = require('@/json/psdName.json') // 图层中英文对照表
const partMap = require('@/json/partMap.json') // 图层(中文名)归属部件
const layerSort = require('@/json/layerSort.json') // 图层(中文名)排序

3、下载项目里的文件  excel

 

// F:\projectCode\xxx-client\src\excel\pointTmt.xlsx

import eventTemplate from '@/excel/pointTmt.xlsx'

<a download="埋点文档格式规范.xlsx" :href="eventTemplate"> 埋点文档格式规范 </a>

4、iframe 嵌入 pdf

 

F:\projectCode\xxx-client\src\pdf\index.pdf

import pdf from '@/pdf/index.pdf'

<iframe style="100%;height:800px;" :src="pdf" frameborder="0"></iframe> -->
            <!-- src="http://192.168.0.239:3112/pdf/%E6%95%B0%E6%8D%AE%E6%8C%87%E6%A0%87%E5%AE%9A%E4%B9%89.pdf" 

5、svga

https://www.cnblogs.com/dhjy123/p/15438237.html

6、svg

 https://www.cnblogs.com/dhjy123/p/15347053.html

附上  webpack rule 配置

  chainWebpack: (config) => {
    config.resolve.alias
      .set('@$', resolve('src'))
      .set('@api', resolve('src/api'))
      .set('@assets', resolve('src/assets'))
      .set('@comp', resolve('src/components'))
      .set('@views', resolve('src/views'))
      .set('@layout', resolve('src/layout'))
      .set('@static', resolve('src/static'))
    if (isProduction) {
      config
        .plugin('webpack-bundle-analyzer')
        .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
    }
    config.module
      .rule('xlsx')
      .test(/\.xlsx$/)
      .use('file-loader')
      .loader('file-loader')
      .options({
        name: 'excel/[name].[hash:8].[ext]'
      })
      .end()
    // const pdfRule = config.module.rule('pdf')
    // pdfRule.uses.clear()
    // pdfRule
    //     .use('file-loader')
    //     .loader('file-loader')
    //     .options({
    //         name: 'pdf/[name].[hash:8].[ext]'
    //     })

    const svgRule = config.module.rule('svg')
    svgRule.uses.clear()
    svgRule
      .oneOf('inline')
      .resourceQuery(/inline/)
      .use('vue-svg-icon-loader')
      .loader('vue-svg-icon-loader')
      .end()
      .end()
      .oneOf('external')
      .use('file-loader')
      .loader('file-loader')
      .options({
        name: 'assets/[name].[hash:8].[ext]'
      })
  },