Saya mewarisi proyek Vue yang hanya membangun build produksi dan memperburuk semuanya. Itu tidak memiliki webpack.config.js seperti yang biasa saya lakukan, hanya memiliki file vue.config.js. Ketika saya melakukan npm run build itu membangun produksi. Perintah build adalah "build": "vue-cli-service build" dan saya tidak melihat cara untuk melakukan sesuatu seperti --mode=development.

Saya mencoba menambahkan file webpack.config.js yang dibangun, tetapi pada saat yang sama merusak halaman web, karena tidak lagi membangun yang sama.

Ini file vue.config.js saya:

const path = require('path');
const CopyWebpackPlugin = require('copy-webpack-plugin');


module.exports = {
    lintOnSave: true,
    baseUrl: 'http://localhost:8080',
    configureWebpack: {
        entry: './src/main.js',
        module: {
            rules: [
                {
                    test: /libs\.js$/,
                    use: {
                        loader: 'script-loader'
                    }
                },
                {
                    test: /angLibs\.js$/,
                    use: {
                        loader: 'script-loader'
                    }
                },
                {
                    test: /welcome\.js$/,
                    use: {
                        loader: 'script-loader'
                    }
                },
                {
                    test: /app\.js$/,
                    use: {
                        loader: 'script-loader'
                    }
                }
            ]

        },
        output: {
            publicPath: process.env.VUE_APP_ROOT_API + '/',
            chunkFilename: '[name].bundle.js'
        },
        plugins: [
            new CopyWebpackPlugin([
                { from: path.resolve(__dirname, './static/App/i18n/*.*'), to: path.resolve(__dirname, './dist/'), force: true }
            ], { copyUnmodified: true, context: 'static/' }),
            new CopyWebpackPlugin([
                { from: path.resolve(__dirname, './static/Content/*/*.*'), to: path.resolve(__dirname, './dist/'), force: true }
            ], { copyUnmodified: true, context: 'static/' }),
            new CopyWebpackPlugin([
                { from: path.resolve(__dirname, './static/fonts/*.*'), to: path.resolve(__dirname, './dist/'), force: true }
            ], { copyUnmodified: true, context: 'static/' }),
            new CopyWebpackPlugin([
                { from: path.resolve(__dirname, './static/react/*.*'), to: path.resolve(__dirname, './dist/'), force: true }
            ], { copyUnmodified: true, context: 'static/' })
        ]
    }
};

Saya ingin memiliki build pengembangan yang lebih cepat dan tidak diperkecil/diperkecil (atau menyimpan file peta dari file yang disertakan dalam webpack).

2
Jeremy 29 Maret 2019, 05:36

1 menjawab

Jawaban Terbaik

Itu adalah versi Vue CLI v3. Untuk dev-server webpack dengan hot-reload, gunakan npm run serve.

Jika tidak, Anda dapat membangun dalam mode development melalui

npx vue-cli-service build --mode development

Atau, jika Anda tidak memiliki npx

./node_modules/.bin/vue-cli-service build --mode development

Lihat https://cli.vuejs.org/guide/mode-and-env .html


Opsi lain adalah menambahkan skrip baru ke package.json, mis

"buildDev": "vue-cli-service build --mode development"

Dan lari

npm run buildDev

Untuk mengonfigurasi Webpack, lihat https://cli.vuejs.org/guide/webpack.html.

Sebagai contoh

// vue.config.js
module.exports = {
  configureWebpack: {
    // config goes here
  }
}
3
Phil 29 Maret 2019, 02:53