B
B
BonBon Slick2020-12-31 08:25:58
Google Chrome
BonBon Slick, 2020-12-31 08:25:58

Vue Content-Security-Policy config?

It doesn’t work out to set up this meta param, errors are constantly climbing either locally or on the test server. And allowing all unsafe meaning then this tag will have 0

{
                    'http-equiv': 'Content-Security-Policy',
                    //  content:      `default-src 'self'; font-src 'self' data:;  script-src 'self'`,
                    // content:      `default-src 'self'`,
                    content:      `script-src 'self' 'unsafe-inline' 'unsafe-eval';  style-src 'self' 'unsafe-inline' 'unsafe-eval'; media-src *`,
                },

module.exports = {
    mode:         'development',
    entry:        [
        './src/app.js',
    ],
    // devtool:      false,
    watch:        true,
    watchOptions: {
        poll: true,
    },
    output:       {
        path:       path.resolve(__dirname, '../dist'),
        filename:   'main.js',
        publicPath: '/',
    },
    // devServer: {},
    module:       {
        rules: [
            {
                test:    /\.vue$/,
                loader:  'vue-loader',
                options: {
                    loaders: {
                        scss: 'vue-style-loader!css-loader!sass-loader', // <style lang="scss">
                        sass: 'vue-style-loader!css-loader!sass-loader?indentedSyntax', // <style lang="sass">
                    },
                },
            },
            {
                test:    /\.js$/,
                use:     'source-map-loader',
                exclude: /node_modules/,
            },
            {
                test: /\.css$/,
                use:  [
                    'vue-style-loader',
                    'style-loader',
                    'css-loader',
                ],
            },
            {
                test: /\.scss$/,
                use:  [
                    {
                        loader: 'style-loader',
                    },
                    {
                        loader: 'css-loader',
                    },
                    {
                        loader: 'sass-loader',
                    },
                ],
            },
            {
                test:    /\.(png|jpg)$/,
                loader:  'file-loader',
                options: {
                    name: '[name].[ext]?[hash]',
                },
            },
            {
                test: /\.(otf|eot|woff|woff2|ttf|svg)$/,
                use:  [
                    {
                        loader:  'file-loader',
                        options: {
                            name:       '[name].[ext]',
                            outputPath: 'fonts/',
                        },
                    },
                ],
            },
        ],
    },
    plugins:      [
        new VueLoaderPlugin(),
        new FriendlyErrorsPlugin(),
        new webpack.HotModuleReplacementPlugin(),
        new MiniCssExtractPlugin({
            filename:      '[name].css',
            chunkFilename: '[id].css',
            ignoreOrder:   false, // Enable to remove warnings about conflicting order
        }),
        new CopyWebpackPlugin([
            {
                from: path.join(__dirname, '../static'),
                to:   path.join(__dirname, '../dist/static'),
            },
            {
                from: path.join(__dirname, '../public'),
                to:   path.join(__dirname, '../dist/'),
            },
        ]),
        new HtmlWebpackPlugin({
            filename: 'index.html',
            template: 'index_dev.html',
            inject:   true,
        }),
    ],
    resolve:      {
        extensions: ['.js', '.vue', '.json'],
        alias:      {
            vue$: 'vue/dist/vue.js',
            '@':  path.resolve(__dirname, '../src'),
        },
    },
};

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question