IT이야기

Vue-cli 버전 3 베타 웹 팩 구성

cyworld 2022. 3. 8. 21:55
반응형

Vue-cli 버전 3 베타 웹 팩 구성

가장 쉬운 웹 팩 구성을 위한 큰 단계가 될 vuejs/vue-cli (beta 3.0 )의 다음 버전을 배우고 테스트하려고 한다.그 사이에 몇 가지 예가 있다....

테스트로 나는 vue-cli v2에서 벗어나려고 했다.

webpack.dev.conf.js

plugins: [
    //...
    // copy custom static assets
    new CopyWebpackPlugin([
        {
            from: path.resolve(__dirname, '../static'),
            to: config.dev.assetsSubDirectory,
            ignore: ['.*']
        }
    ]) ]

새 vue-cli 버전 3(베타)로

vue.config.js

const path = require('path')

module.exports = {
    chainWebpack: config => {
        config
            .plugin('copy')
            .use(require('copy-webpack-plugin')), [{
                from: path.resolve(__dirname, '../static'),
                to: 'static', ignore: ['.*']
            }]
    }
}

러닝의

npm run serve

불평하지 않는다...

그래서 괜찮은 것 같긴 한데, 혹시 이 주제에 대해 이미 존재하는 종이, 견본, 예시가 있는지 알고 싶어.당분간 나는 기존 코드 소스를 읽음으로써만 새로운 특징을 발견한다.

현재 나는 이것을 변환하는데 어려움을 겪고 있다.

new webpack.ProvidePlugin({
  $: 'jquery',
  jquery: 'jquery',
  jQuery: 'jquery',
  'window.jQuery': 'jquery'
}),

나는 노력했다.

config
  .plugin('provide')
  .use(require('webpack.ProvidePlugin')), [{
    $: 'jquery',
    jquery: 'jquery',
    jQuery: 'jquery',
    'window.jQuery': 'jquery'
  }]

하지만 나는 오류를 얻었다:

 INFO  Starting development server...
 ERROR  Error: Cannot find module 'webpack.ProvidePlugin'
 Error: Cannot find module 'webpack.ProvidePlugin'
   at Function.Module._resolveFilename (module.js:536:15)

웹 팩 v4를 사용하지 않는 경우(v4는 어떤 이유로 오류를 발생함):

const webpack = require('webpack');

module.exports = {
    chainWebpack: config => {
        config
            .plugin('provide')
            .use(webpack.ProvidePlugin, [{
                $: 'jquery',
                jquery: 'jquery',
                jQuery: 'jquery',
                'window.jQuery': 'jquery'
            }]);
    },
};

(설명 섹션에 나와 공유한 설명서에서 발견됨)을 변경하려는 경우 익숙해지고 싶은 사항일 수 있음vue-cli배열

참고: 플러그인에 대한 어레이 전달 매개 변수를 사용해야 함플러그인 자체는 개체를 예상하지만,use()일련의 논쟁들을 기다리고 있다.그렇기 때문에 배열을 사용해야 한다.

요구 명령이 잘못됨/비정상적임, 웹 팩 또는 vue-cli와는 무관함

예제 코드:

config
  .plugin('provide')
  .use(require('webpack').ProvidePlugin, [{
    $: 'jquery',
    jquery: 'jquery',
    jQuery: 'jquery',
    'window.jQuery': 'jquery'
  }])

다음 전에 새 플러그인 사용량을 정의해야 함...

const path = require('path')
const webpack = require('webpack')

module.exports = {
  configureWebpack: {
    plugins: [
      new webpack.ProvidePlugin({
        $: 'jquery',
        jquery: 'jquery',
        jQuery: 'jquery',
        'window.jQuery': 'jquery'
      })
    ]
  }
}

최신 Vue CLI 버스티온 ATM(3.2.1)을 사용하여 생성된 프로젝트에서 jQuery를 구성하려면 프로젝트에 웹 팩 플러그인을 추가해야 한다는 것을 알았다.

이 작업은vue.config.js두 개의 상위 답을 모두 사용하는 다음과 같은 구문을 사용하여:

module.exports = {
  chainWebpack: config => {
    config.plugin("provide").use(require("webpack").ProvidePlugin, [
      {
        $: "jquery",
        jQuery: "jquery"
      }
    ]);
  }
};

이렇게 하면 설치가 방지됨webpack그리고 일련의 물체를 에 전달한다.config.plugin물체보다는 기능을 하다

참조URL: https://stackoverflow.com/questions/49626085/vue-cli-version-3-beta-webpack-configuration

반응형