IT이야기

텍스트 파일의 내용을 Nuxt(또는 Vue) 문자열로 읽으려면 어떻게 해야 합니까?

cyworld 2022. 7. 25. 22:41
반응형

텍스트 파일의 내용을 Nuxt(또는 Vue) 문자열로 읽으려면 어떻게 해야 합니까?

.vue 파일에 Import한 텍스트 파일의 내용을 읽는 것을 좋아합니다.import ToS from '~/static/terms-of-service.txt';

내용에 String으로 접근하고 싶습니다.

어떻게 해야 하죠?

VUE CLI 3

  1. 먼저 원시 로더를 설치합니다.npm install raw-loader --save-dev

  2. vue.config.js가 없는 경우 루트에 vue.config.js를 만들고

    module.exports = {
      chainWebpack: config => {
        config.module
          .rule('raw')
          .test(/\.txt$/)
          .use('raw-loader')
          .loader('raw-loader')
          .end()
      }
    }
    
  3. 텍스트 파일을 문자열로 가져오려면(src/assets/txt/에 있는 경우):import file from '@/assets/txt/file.txt'

N.B. 재구축 잊지 마세요.

nuxt(vue cli 3으로 작성)를 사용하고 있는데, 다음과 같이 동작했습니다.

  1. npm install --save-dev raw-loader
  2. 갱신하다nuxt.config.js
  build: {
    /*
    ** You can extend webpack config here
    */
    extend (config, ctx) {

      config.module.rules.push({
        enforce: 'pre',
        test: /\.txt$/,
        loader: 'raw-loader',
        exclude: /(node_modules)/
      });

    }
  }

https://github.com/webpack-contrib/raw-loader을 사용하게 되었습니다.

vue에서 파일을 읽으려면 로더가 필요한 것 같습니다.

언급URL : https://stackoverflow.com/questions/46896177/how-can-i-read-the-contents-from-a-text-file-as-a-string-in-nuxt-or-vue

반응형