如何修复appConfigCore不使用显式注释,并且不能在严格模式下调用

时间:2019-04-04 05:49:40

标签: angularjs webpack-2

我正在使用webpack 2.2.0重新配置我的项目。首先,配置代码显示

var isTest = false;
var isProd = true;

我将其更新为

var ENV = process.env.npm_lifecycle_event;
var isTest = ENV === 'test' || ENV === 'test-watch';
var isProd = ENV === 'build';

,现在它成功编译了webpack,但最终输出(即localhost给我错误

Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
Error: [$injector:modulerr] Failed to instantiate module app.core due to:
Error: [$injector:strictdi] appConfigCore is not using explicit annotation and cannot be invoked in strict mode

任何人都可以帮助解决此错误,我是angularjs的新手。

我还要附加代码和Webpack配置。

var angular = require('angular');
var async = require('async');
var _ = require('underscore');
var AWS = require('aws-sdk');

require('angular-drag-and-drop-lists/angular-drag-and-drop-lists.min.js');
require('angular-ui-router');
require('angular-ui-bootstrap/dist/ui-bootstrap-tpls.js');
require('angular-ui-bootstrap/dist/ui-bootstrap-csp.css');
require('angular-resource');
require('angular-cookies');
require('angular-animate');
require('ngstorage');
require('angular-jwt');
require('ng-infinite-scroll');
require('angular-sanitize');
require('angular-loading-bar');
require('angular-base64');
require('ng-file-upload');
require('satellizer');
require('ui-select');
require('re-tree');
require('ng-device-detector/ng-device-detector.js');

/////////////////////////////////////////////////////////////

angular.module('app.core', [
    'ui.router',
    'ngSanitize',
    'ngAnimate',
    'ui.bootstrap',
    'ui.bootstrap.pagination',
    'ui.select',
    'ngResource',
    'ngStorage',
    'angular-jwt',
    'infinite-scroll',
    'base64',
    'angular-loading-bar',
    'ngTable',
    'ui.bootstrap',
    'ngFileUpload',
    'angular-bind-html-compile',
    'mm.acl',
    'satellizer',
    'rzModule',
    'ngMaterial',
    'dndLists',
    '720kb.socialshare',
    'directive.g+signin',
    'ngCookies'

])
.config(appConfigCore)
.filter('capitalize', function() {
    return function(input) {
      return (!!input) ? input.charAt(0).toUpperCase() + input.substr(1).toLowerCase() : '';
    }
});

function appConfigCore($stateProvider, $authProvider, $httpProvider, $locationProvider, $urlRouterProvider, $resourceProvider, $localStorageProvider) {
    "ngInject";
    $resourceProvider.defaults.stripTrailingSlashes = false;
    $httpProvider.defaults.xsrfCookieName = 'csrftoken';
    $httpProvider.defaults.xsrfHeaderName = 'X-CSRFToken';
}
'use strict';

var fs = require('fs');
var gracefulFs = require('graceful-fs');
var path = require("path");

gracefulFs.gracefulify(fs);

// Modules
var webpack = require('webpack');
var autoprefixer = require('autoprefixer');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var CopyWebpackPlugin = require('copy-webpack-plugin');
var ngAnnotatePlugin = require('ng-annotate-webpack-plugin');
const WebpackConfig = require('webpack-config');

/**
 * Env
 * Get npm lifecycle event to identify the environment
 */
var ENV = process.env.npm_lifecycle_event;
var isTest = ENV === 'test' || ENV === 'test-watch';
var isProd = ENV === 'build';

// module.exports = function makeWebpackConfig() {
    /**
     * Config
     * Reference: http://webpack.github.io/docs/configuration.html
     * This is the object where all configuration gets set
     */
    var config = {};

    /**
     * Entry
     * Reference: http://webpack.github.io/docs/configuration.html#entry
     * Should be an empty object if it's generating a test build
     * Karma will set this when it's a test build
     */
    config.entry = isTest ? void 0 : {
        app: './newsrc/app/app.js',
    };

    /**
     * Output
     * Reference: http://webpack.github.io/docs/configuration.html#output
     * Should be an empty object if it's generating a test build
     * Karma will handle setting it up for you when it's a test build
     */
    config.output = isTest ? {} : {
        // Absolute output directory
        path: __dirname + '/dist',

        // Output path from the view of the page
        // Uses webpack-dev-server in development
        publicPath: isProd ? '/' : 'http://localhost:8080/',

        // Filename for entry points
        // Only adds hash in build mode
        filename: isProd ? '[name].[hash].js' : '[name].bundle.js',

        // Filename for non-entry points
        // Only adds hash in build mode
        chunkFilename: isProd ? '[name].[hash].js' : '[name].bundle.js'
    };

    /**
     * Devtool
     * Reference: http://webpack.github.io/docs/configuration.html#devtool
     * Type of sourcemap to use per build type
     */
    if (isTest) {
        config.devtool = 'inline-source-map';
    }
    else if (isProd) {
        config.devtool = 'source-map';
    }
    else {
        config.devtool = 'eval-source-map';
    }

    /**
     * Loaders
     * Reference: http://webpack.github.io/docs/configuration.html#module-loaders
     * List: http://webpack.github.io/docs/list-of-loaders.html
     * This handles most of the magic responsible for converting modules
     */

    // Initialize module
    config.module = {
        rules: [{
            // JS LOADER
            // Reference: https://github.com/babel/babel-loader
            // Transpile .js files using babel-loader
            // Compiles ES6 and ES7 into ES5 code
            test: /\.js$/,
            loader: 'babel-loader',
            exclude: /node_modules/
        }, {
            // CSS LOADER
            // Reference: https://github.com/webpack/css-loader
            // Allow loading css through js
            //
            // Reference: https://github.com/postcss/postcss-loader
            // Postprocess your css with PostCSS plugins
            test: /\.css$/,
            // Reference: https://github.com/webpack/extract-text-webpack-plugin
            // Extract css files in production builds
            //
            // Reference: https://github.com/webpack/style-loader
            // Use style-loader in development.

            loader: isTest ? 'null-loader' : ExtractTextPlugin.extract({
                fallbackLoader: 'style-loader',
                loader: [
                    {loader: 'css-loader', query: {sourceMap: true}},
                    {loader: 'postcss-loader'}
                ],
            })
        }, {
            test: /\.(eot|otf|woff|woff2|ttf|svg)$/,
            loader: 'url-loader?limit=30000&name=css/[name].[ext]'
        }, {
            // ASSET LOADER
            // Reference: https://github.com/webpack/file-loader
            // Copy png, jpg, jpeg, gif, svg, woff, woff2, ttf, eot files to output
            // Rename the file using the asset hash
            // Pass along the updated reference to your code
            // You can add here any file extension you want to get copied to your output
            test: /\.(png|jpg|jpeg|gif)$/,
            loader: 'file-loader?name=img/[hash:6].[ext]'
        }, {
            // HTML LOADER
            // Reference: https://github.com/webpack/raw-loader
            // Allow loading html through js
            test: /\.html$/,
            loader: 'raw-loader',
        }]
    };

    // ISTANBUL LOADER
    // https://github.com/deepsweet/istanbul-instrumenter-loader
    // Instrument JS files with istanbul-lib-instrument for subsequent code coverage reporting
    // Skips node_modules and files that end with .spec.js
    if (isTest) {
        config.module.rules.push({
            enforce: 'pre',
            test: /\.js$/,
            exclude: [
                /node_modules/,
                /\.spec\.js$/
            ],
            loader: 'istanbul-instrumenter-loader',
            query: {
                esModules: true
            }
        })
    }

    /**
     * PostCSS
     * Reference: https://github.com/postcss/autoprefixer-core
     * Add vendor prefixes to your css
     */
    // NOTE: This is now handled in the `postcss.config.js`
    //       webpack2 has some issues, making the config file necessary

    /**
     * Plugins
     * Reference: http://webpack.github.io/docs/configuration.html#plugins
     * List: http://webpack.github.io/docs/list-of-plugins.html
     */
    config.plugins = [
        new webpack.LoaderOptionsPlugin({
            test: /\.scss$/i,
            options: {
                postcss: {
                    plugins: [autoprefixer]
                }
            }
        }),
        new webpack.ProvidePlugin({
            "$": "jquery",
            "jQuery": "jquery",
            'window.jQuery': 'jquery',
        }),        
        new ngAnnotatePlugin({
            add: true,
            prettyPrint: true
        }),
    ];

    // Skip rendering index.html in test mode
    if (!isTest) {
        // Reference: https://github.com/ampedandwired/html-webpack-plugin
        // Render index.html
        config.plugins.push(
            new HtmlWebpackPlugin({
                template: './newsrc/public/index.php',
                inject: 'body'
            }),

            // Reference: https://github.com/webpack/extract-text-webpack-plugin
            // Extract css files
            // Disabled when in test mode or not in build mode
            new ExtractTextPlugin({filename: 'css/[name].css', disable: !isProd, allChunks: true})
        )
    }

    // Add build specific plugins
    if (isProd) {

        config.plugins.push(
            // Reference: http://webpack.github.io/docs/list-of-plugins.html#noerrorsplugin
            // Only emit files when there are no errors
            new webpack.NoErrorsPlugin(),

            // Reference: http://webpack.github.io/docs/list-of-plugins.html#dedupeplugin
            // Dedupe modules in the output
            // new webpack.optimize.DedupePlugin(),

            // Chunks
            // new webpack.optimize.CommonsChunkPlugin({
            //     name: 'vendor',
            //     filename: isProd ? 'vendor.[hash].bundle.js' : 'vendor.bundle.js',
            //     minChunks: 2,

            // }),

            //Remove this comment when you want to do final build.  this line will minifiy vendor.js file
            new webpack.optimize.UglifyJsPlugin(),

            // Copy assets from the public folder
            // Reference: https://github.com/kevlened/copy-webpack-plugin
            new CopyWebpackPlugin([{
                from: __dirname + '/newsrc/public'
            }])
        )
    }

    /**
     * Dev server configuration
     * Reference: http://webpack.github.io/docs/configuration.html#devserver
     * Reference: http://webpack.github.io/docs/webpack-dev-server.html
     */
    config.devServer = {
        contentBase: './newsrc/public',
        stats: 'minimal'
    };


module.exports = config;
// }();

0 个答案:

没有答案