错误:您应该使用$ window服务而不是默认的窗口对象

时间:2017-12-27 08:14:20

标签: angularjs webpack eslint

我正在尝试在角度控制器中使用jQuery,但我遇到了错误

这是我的package.json

{
"dependencies": {
    "angular": "^1.6.2",
    "angular-animate": "^1.6.8",
    "angular-aria": "^1.6.8",
    "angular-material": "^1.1.5",
    "angular-messages": "^1.6.8",
    "angular-ui-router": "1.0.0-beta.3",
    "jquery": "^3.2.1"
},
"devDependencies": {
    "@types/angular": "^1.6.6",
    "@types/angular-mocks": "^1.5.9",
    "@types/angular-ui-router": "^1.1.36",
    "@types/jquery": "^2.0.40",
    "angular-mocks": "^1.6.2",
    "autoprefixer": "^6.7.3",
    "babel-core": "^6.23.1",
    "babel-eslint": "^7.1.1",
    "babel-loader": "^6.3.2",
    "babel-plugin-istanbul": "^4.0.0",
    "babel-polyfill": "^6.23.0",
    "babel-preset-es2015": "^6.22.0",
    "browser-sync": "^2.18.8",
    "browser-sync-spa": "^1.0.3",
    "css-loader": "^0.26.1",
    "del": "^2.2.2",
    "es6-shim": "^0.35.3",
    "eslint": "^3.19.0",
    "eslint-config-angular": "^0.5.0",
    "eslint-config-xo-space": "^0.15.0",
    "eslint-loader": "^1.6.1",
    "eslint-plugin-angular": "^1.6.1",
    "eslint-plugin-babel": "^4.0.1",
    "extract-text-webpack-plugin": "^2.0.0-rc.3",
    "gulp": "gulpjs/gulp#4ed9a4a3275559c73a396eff7e1fde3824951ebb",
    "gulp-angular-filesort": "^1.1.1",
    "gulp-angular-templatecache": "^2.0.0",
    "gulp-filter": "^5.0.0",
    "gulp-htmlmin": "^3.0.0",
    "gulp-hub": "frankwallis/gulp-hub#d461b9c700df9010d0a8694e4af1fb96d9f38bf4",
    "gulp-insert": "^0.5.0",
    "gulp-ng-annotate": "^2.0.0",
    "gulp-sass": "^3.1.0",
    "gulp-util": "^3.0.8",
    "html-loader": "^0.4.4",
    "html-webpack-plugin": "^2.28.0",
    "jasmine": "^2.5.3",
    "json-loader": "^0.5.4",
    "karma": "^1.4.1",
    "karma-angular-filesort": "^1.0.2",
    "karma-coverage": "^1.1.1",
    "karma-jasmine": "^1.1.0",
    "karma-junit-reporter": "^1.2.0",
    "karma-ng-html2js-preprocessor": "^1.0.0",
    "karma-phantomjs-launcher": "^1.0.2",
    "karma-phantomjs-shim": "^1.4.0",
    "karma-webpack": "^2.0.2",
    "ng-annotate-loader": "^0.2.0",
    "node-sass": "^4.5.0",
    "phantomjs-prebuilt": "^2.1.14",
    "postcss-loader": "^1.3.1",
    "sass-loader": "^6.0.1",
    "style-loader": "^0.13.1",
    "webpack": "^2.2.1",
    "webpack-fail-plugin": "^1.0.5"
},
"scripts": {
    "build": "gulp",
    "serve": "gulp serve",
    "serve:dist": "gulp serve:dist",
    "test": "gulp test",
    "test:auto": "gulp test:auto"
},
"eslintConfig": {
    "globals": {
        "expect": true
    },
    "root": true,
    "env": {
        "browser": true,
        "jasmine": true
    },
    "parser": "babel-eslint",
    "extends": [
        "xo-space/esnext"
    ]
}
}

我的webpack.config.js是

const webpack = require('webpack');
const conf = require('./gulp.conf');
const path = require('path');

const HtmlWebpackPlugin = require('html-webpack-plugin');
const FailPlugin = require('webpack-fail-plugin');
const autoprefixer = require('autoprefixer');

module.exports = {
module: {
    loaders: [{
            test: /\.json$/,
            loaders: [
                'json-loader'
            ]
        },
        {
            test: /\.js$/,
            exclude: /node_modules/,
            loader: 'eslint-loader',
            enforce: 'pre'
        },
        {
            test: /\.(css|scss)$/,
            loaders: [
                'style-loader',
                'css-loader',
                'sass-loader',
                'postcss-loader'
            ]
        },
        {
            test: /\.js$/,
            exclude: /node_modules/,
            loaders: [
                'ng-annotate-loader',
                'babel-loader'
            ]
        },
        {
            test: /\.html$/,
            loaders: [
                'html-loader'
            ]
        }
    ]
},
plugins: [
    new webpack.optimize.OccurrenceOrderPlugin(),
    new webpack.NoEmitOnErrorsPlugin(),
    FailPlugin,
    new HtmlWebpackPlugin({
        template: conf.path.src('index.html')
    }),
    new webpack.LoaderOptionsPlugin({
        options: {
            postcss: () => [autoprefixer]
        },
        debug: true
    }),
    new webpack.ProvidePlugin({
        $: "jquery",
        jQuery: "jquery"
    }),
],
devtool: 'source-map',
output: {
    path: path.join(process.cwd(), conf.paths.tmp),
    filename: 'index.js'
},
entry: `./${conf.path.src('index')}`
};

在上面的webpack配置文件中我将jQuery设置为window对象。但在控制器内我无法访问它。在执行gulp服务后,在lint错误中显示上述错误。

0 个答案:

没有答案