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
'IT이야기' 카테고리의 다른 글
vue-cli 프로젝트에서 포트 번호를 변경하는 방법 (0) | 2022.03.08 |
---|---|
파이썬에서 scp 하는 법? (0) | 2022.03.08 |
행 삭제 후 Boostrap-Vue 테이블 새로 고침 (0) | 2022.03.08 |
기본 키 반응 - 플랫리스트와 함께 키 추출기 사용 (0) | 2022.03.08 |
Vuejs를 사용하여 요소 높이 가져오기 (0) | 2022.03.08 |